用户单击刷新时处理ajax错误

Question

如果这是我应该能够查找的内容,我道歉.我想要的所有条款都超载了..

这是我的问题:当我打开一个页面时,它会触发一系列的ajax调用.如果我然后按Shift + Refresh,所有这些ajax调用都被视为错误,并在整个页面本身重新加载之前显示其错误消息对话框.

所以错误是由客户端触发的 - 无论如何我可以找出是否是这种情况所以我可以忽略它？例如在xmlhttprequest中,或在ajax函数中(我使用的是jquery btw)

Answer 1

有几种建议的方法可以检测到这种情况:

• 有几个人建议使用beforeunload处理程序来设置一个布尔标志,以便错误处理程序可以知道页面正在被卸载(参见下面的相关/重复帖子列表).这很棒,除了iOS上的移动Safari不支持该beforeunload事件.

• Sachindra提出了一种方法,它不是立即触发错误函数,而是延迟了一秒钟setTimeout(..., 1000).这样,在调用错误处理程序时,页面很可能实际上已消失."好机会"就是这样.我打赌如果我有一个巨大的页面,例如很多<input>s,卸载可能需要1秒多的时间,然后错误处理程序可能会解雇.

因此,我建议可靠地检测beforeunload支持的组合,如果beforeunload不支持(咳嗽 iPad/iPhone 咳嗽)恢复到Sachindra的延迟技巧.

通过beforeunload检测查看完整的解决方案,并在此jsfiddle中查看所有内容.

对于jQuery 2.x而言,情况看起来比1.x好一些,但2.x也似乎有点不稳定,所以我仍然认为这个建议是谨慎的.

PS:还有一些建议涉及测试XHR/ jqXHRobject 中的某些字段.(这里和这里).在长时间运行的AJAX调用期间,我还没有能够区分用户导航和重新启动Web服务器的组合,因此我没有发现这种方法对我有用.

这也是这些相关/重复的Stack Overflow问题的答案:

• jQuery AJAX在窗口卸载时触发错误回调？
• 由于浏览器重新加载,$ .ajax在请求失败时调用成功处理程序
• 如何最好地处理由用户单击链接导致的jquery ajax调用期间的错误
• 检测到jQuery.ajax调用失败,因为页面正在重新加载？

以及Stack Overflow之外的这些帖子:

• 由于页面重新加载,处理AJAX错误的正确方法是什么？
• 如何区分用户中止的AJAX调用与错误| 我喜欢的东西.

Answer 2

[这是上一个答案的编辑,其中包含我已经解决的突出问题]

当用户通过刷新,单击链接或更改浏览器中的URL导航离开页面时,jQuery会抛出错误事件.您可以通过为ajax调用实现错误处理程序并检查xmlHttpRequest对象来检测这些类型的错误:

$.ajax({
    /* ajax options omitted */
    error: function (xmlHttpRequest, textStatus, errorThrown) {
         if(xmlHttpRequest.readyState == 0 || xmlHttpRequest.status == 0) 
              return;  // it's not really an error
         else
              // Do normal error handling
});

Answer 3

var isPageBeingRefreshed = false;

window.onbeforeunload = function() {
    isPageBeingRefreshed = true;
};

$.ajax({
    error: function (xhr, type, errorThrown) {
        if (!xhr.getAllResponseHeaders()) {
            xhr.abort();
            if (isPageBeingRefreshed) {
                return; // not an error
            }
        }
    }
});