如何捕获jQuery AJAX错误?

时间:2022-10-28 13:08:40

When an AJAX request is submitted to a site, server-side errors are easily handled with the jQuery promise approach. .done(), .fail(), etc. However for some requests (e.g. to an invalid site or one that doesn't accept cross-origin requests), an exception occurs immediately as the call is made. Here's an example of one error in the console:

当AJAX请求提交给站点时,使用jQuery promise方法很容易处理服务器端错误。下面是控制台中的一个错误示例:

XMLHttpRequest cannot load http://someotherserver/api/blahblah. Origin http://localhost:52625 is not allowed by Access-Control-Allow-Origin.

XMLHttpRequest不能加载http://someotherserver/api/blahblah。访问控制允许的来源不允许访问http://localhost:52625。

Yes, I know about CORS...that's not the issue. What I'm actually doing is trying a web api call to test if the server IP/name is correct

是的,我知道CORS…这不是问题。我实际上做的是尝试一个web api调用来测试服务器IP/名称是否正确

I'm aware of the error option in the jQuery request syntax:

我知道jQuery请求语法中的错误选项:

$.ajax({
    url: remoteURL,
    type: 'GET',
    error: function (err) {
        console.log("AJAX error in request: " + JSON.stringify(err, null, 2));
    }
}).etc.etc.

The error is handled here, but exceptions are still logged in the console. It seemed reasonable to wrap the above in a try-catch block, but that doesn't seem to help.

这里处理错误,但是异常仍然记录在控制台中。把上面的东西用try-catch块包装起来似乎是合理的,但这似乎并没有什么帮助。

I've found this question, but the solution involves hacking the jQuery code. Surely there's a better way to catch these errors and not clog up the console logs??

我发现了这个问题,但是解决方案涉及到破解jQuery代码。肯定有更好的方法来捕获这些错误,而不会阻塞控制台日志吗?

2 个解决方案

#1


7  

try this:

试试这个:

$.ajax({
    url: remoteURL,
    type: 'GET',
    error: function (err) {
        console.log("AJAX error in request: " + JSON.stringify(err, null, 2));
    }
}).always(function(jqXHR, textStatus) {
    if (textStatus != "success") {
        alert("Error: " + jqXHR.statusText);
    }
});

XHR Listener:

XHR侦听器:

$.ajax({
    url: remoteURL,
    type: 'GET',
    xhr: function(){
        var xhr = new window.XMLHttpRequest();
        xhr.addEventListener("error", function(evt){
            alert("an error occured");
        }, false);
        xhr.addEventListener("abort", function(){
            alert("cancelled");
        }, false);

        return xhr;
    },
    error: function (err) {
        console.log("AJAX error in request: " + JSON.stringify(err, null, 2));
    }
});

#2


3  

You can use web developer console in google chrome. Press F12. And use Networks tab for checking response, And for JavaSvript and jQuery and Ajax errors you can use Console tab. :)

你可以在谷歌浏览器中使用web开发控制台。按F12。使用Networks选项卡检查响应,对于JavaSvript、jQuery和Ajax错误,可以使用Console选项卡。:)

Try this by adding to your ajax function :

尝试添加到ajax函数中:

error: function(XMLHttpRequest, textStatus, errorThrown) {
 alert(errorThrown);

#1


7  

try this:

试试这个:

$.ajax({
    url: remoteURL,
    type: 'GET',
    error: function (err) {
        console.log("AJAX error in request: " + JSON.stringify(err, null, 2));
    }
}).always(function(jqXHR, textStatus) {
    if (textStatus != "success") {
        alert("Error: " + jqXHR.statusText);
    }
});

XHR Listener:

XHR侦听器:

$.ajax({
    url: remoteURL,
    type: 'GET',
    xhr: function(){
        var xhr = new window.XMLHttpRequest();
        xhr.addEventListener("error", function(evt){
            alert("an error occured");
        }, false);
        xhr.addEventListener("abort", function(){
            alert("cancelled");
        }, false);

        return xhr;
    },
    error: function (err) {
        console.log("AJAX error in request: " + JSON.stringify(err, null, 2));
    }
});

#2


3  

You can use web developer console in google chrome. Press F12. And use Networks tab for checking response, And for JavaSvript and jQuery and Ajax errors you can use Console tab. :)

你可以在谷歌浏览器中使用web开发控制台。按F12。使用Networks选项卡检查响应,对于JavaSvript、jQuery和Ajax错误,可以使用Console选项卡。:)

Try this by adding to your ajax function :

尝试添加到ajax函数中:

error: function(XMLHttpRequest, textStatus, errorThrown) {
 alert(errorThrown);