jQuery: catch ajax exceptions

Question

Many failed jQuery ajax requests are polluting my console with errors. Looking at the code which produces these console errors (jQuery 1.7.2, line 8240)

                // Do send the request
                // This may raise an exception which is actually
                // handled in jQuery.ajax (so no try/catch here)
                xhr.send( ( s.hasContent && s.data ) || null );

I notice the comment explains why there is no try/catch there. However, even though I have an explicit error callback function in my jQuery.ajax request, I'm still not having those errors handled by jQuery.ajax.

How can I handle jQuery ajax errors in such a way that error messages do not appear in the console?

Edit: Below is my code snippet that does the ajax request, and the precise error message (in Chrome):

$.ajax({
    dataType: 'xml',
    url: "./python/perfdata.xml?sid=" + (new Date()),
    success: function (data) {
        var protocols = $("Protocols", data).children();

        parseData(protocols);
    },
    error: function (error) {
        setTimeout(getData, 200);
    }
});

And here is the Chrome error message:

GET
http://zeus/dashboard/python/perfdata.xml?sid=Thu%20May%2024%202012%2016:09:38%20GMT+0100%20(GMT%20Daylight%20Time)
jquery.js:8240

Can you post both the code creating the AJAX request and the full error message. — Rory McCrossan, May 24 '12 at 15:09
http://api.jquery.com/ajaxError/ and http://api.jquery.com/jQuery.ajax/ — Blazemonger, May 24 '12 at 15:11
Did you try adding a `try/catch` block around the `$.ajax` call? I'm not sure what that error means, but looks like it happens when trying to issue the request, and I think `.ajaxError` only works with errors on the response. — bfavaretto, May 24 '12 at 15:22
I think these console messages are not exceptions at all, these are just notices from the failed network requests. You get similar when you have `` tags referencing missing images. I doubt you will be able to suppress them. — lanzz, May 30 '12 at 14:11
I got these when the response from the server was empty. Trying to figure out why that is.. will post update. — Kinjal Dixit, Aug 04 '12 at 10:41
The problem was that I was opening the index.html from www.example.com, and the $.ajax request was being made to example.com. I used firebug console to make requests, starting from basic $.post and working up in small steps. — Kinjal Dixit, Aug 04 '12 at 11:54
Hide the console errors as explained [here](https://stackoverflow.com/a/30847631/529273) — CarbonMan, Nov 07 '19 at 23:22

score 6 · Answer 1 · answered May 24 '12 at 15:10

6

You can use a custom function to do so

 $(document).ajaxError(ajaxErrorHandler);

and set whatever you need to do in that handler

var ajaxErrorHandler = function () {
        //do something
    }

answered May 24 '12 at 15:10

pollirrata

5,188
2
32
50

1

Ok, I've tried that, but then `ajaxErrorHandler` is executed *on top of* the console error! – Randomblue May 24 '12 at 15:15
1

Thank you! This really helped me out :) – GobSmack Aug 07 '15 at 16:37

score 3 · Answer 2 · answered May 30 '12 at 14:07

did you try?

  $.ajaxSetup({
    timeout:10000,
    beforeSend: function(xhr) {
      //
    },
    complete:function(xhr,status) {
      //
    },      
    error: function(xhr, status, err) {
      switch (status){
      case 'timeout': {}
      case 'parseerror': {}
      case 'abort': {}
      case 'error': {}
      default: {}
      }
    }
  });

score 3 · Accepted Answer · answered Jun 02 '12 at 21:12

You can try this (in chrome works well) if for testing, by overriding the function "send":

$(function() {

    var xhr = null;

    if (window.XMLHttpRequest) {
        xhr = window.XMLHttpRequest;
    }
    else if(window.ActiveXObject('Microsoft.XMLHTTP')){
        // I do not know if this works
        xhr = window.ActiveXObject('Microsoft.XMLHTTP');
    }

    var send = xhr.prototype.send;
    xhr.prototype.send = function(data) {
        try{
            //TODO: comment the next line
            console.log('pre send', data);
            send.call(this, data);
            //TODO: comment the next line
            console.log('pos send');
        }
        catch(e) {
            //TODO: comment the next line
            console.log('err send', e);
        }
    };

    $.ajax({
        dataType: 'xml',
        url: "./python/perfdata.xml?sid=" + (new Date()).getTime(),
        success: function (data) {
            var protocols = $("Protocols", data).children();

            parseData(protocols);
        },
        error: function (error) {
            setTimeout(getData, 200);
        }
    });
});

test

score 1 · Answer 4 · answered Jan 11 '17 at 08:53

I was getting 500 internal server error and when it was point me to the line xhr.send( ( s.hasContent && s.data ) || null );

But when I checked apache logs ( for internal server error ) error was something else in some other code.

Please check that once too.

jQuery: catch ajax exceptions

4 Answers4

Linked