Question

我做了很多$ .ajax调用，并且以一种抛出消息的方式处理来自它们的错误。我发现如果在重新加载页面时正在进行ajax调用，例如单击刷新，或导航到另一个URL，然后我正在进行的ajax调用会触发其错误回调。

如何判断实际错误与因重新加载页面而中止的调用之间的区别？

$.ajax(...)
.success(...)
.error(function(jqXHR) {
  // jqXHR.status == 0 means either failed to contact server,
  // or aborted due to page reload -- how can I tell the difference?
});

Answer 1

添加一个unload处理程序，将标志设置为true。然后，在error处理程序中，您可以检查此标志，并执行适当的操作。

示例：

var unloading = false;
$.ajax(...) ...
 .error(function(jqXHR) {
    if (unloading) return; // Ignore errors caused by navigating away
    // Now, check for real errors ..
});
$(window).unload(function() {unloading = true;});

Answer 2

没有超时和其他魔术标志的更好方法是检查xhr标头。如果没有标题，则响应不是来自服务器，则请求被中止。

var isUserAbortedRequest = function (xhr) {
    return !xhr.getAllResponseHeaders();
}

ajaxRequest
    .fail(function (xhr, error, statusText) {
        console.log("request aborted = ", isUserAbortedRequest(xhr));
    })
    .success(...)

你可以用$ .Defered包装你的ajax请求，如下所示，并使用deferred对象完成\ fail。

$.Deferred(function (def) {           
    ajaxRequest
        .fail(function (xhr, error, statusText) {
            console.log("request aborted = ", isUserAbortedRequest(xhr));

            def.reject({ aborted: isUserAbortedRequest(xhr), error: error });
        })
        .success(function (response) {
            if (response.success == true) {
                def.resolve(response.data);
            }
            else {
                def.reject({ aborted: false, error: response.error });
            }
        });
});

Answer 3

var unloading = false;
$.ajax(...) ...
 .error(function(jqXHR) {
    if (unloading) return; // Ignore errors caused by navigating away
    // Now, check for real errors ..
});
$(window).unload(function() {unloading = true;});

上述技术不适用于定期刷新页面（例如每半秒）。我已经发现，通过将错误处理过程延迟一小段时间，可以避免刷新页面引起的错误。

示例：

$.ajax(...)
.success(...)
.error(function(jqXHR) {
setTimeout(function() {
  // error showing process
}, 1000);
});

除此之外

window.onbeforeunload = function（）{//停止ajax调用}

事件可用于不太频繁刷新ajax调用。

检测到jQuery.ajax调用失败，因为页面正在重新加载？

3 个答案: