在 Event: navigator.onLine 之后重新启动基于 jquery xhr 对象的 Ajax 请求

Question

我们绑定全局 ajax 处理程序来检查浏览器是否离线：

$(document).ajaxSend(function(event, xhr, settings, response){  
   if(!navigator.onLine){  
        xhr.abort();  
   }  
}

然后我们向用户显示一个对话框，表明浏览器已离线，并绑定“在线”事件，以便在浏览器再次上线时隐藏该对话框。

是否有无论如何（即使是一个 hacky）根据旧的适合旧上下文的旧 Ajax 请求重新启动 Ajax 请求？

Answer 1

这是我能想到的最简洁的方法：

1. 用于缓存 AJAX 请求设置的队列，以便每个后续调用都不会覆盖前一个

2. ajaxSend() 处理程序中的条件，用于推送调用放在队列中以供稍后使用或执行整个队列。

   !(函数($, 窗口, 未定义){
       var ajaxRequestQueue = [], // 离线时发出的请求队列
           isProcessingQueue = false；
   
       函数 processRequestQueue() {
           if (isProcessingQueue === true)
           {
               返回;
           }
   
           isProcessingQueue = true；
           while (设置 = ajaxRequestQueue.shift())
           {
               $.ajax(设置);
           }
           isProcessingQueue = false；
       }
   
       $(文档).ajaxSend(函数(事件、xhr、设置、响应){
           if (!navigator.onLine) {
               // 中止原来的请求
               xhr.abort();
               // 将请求设置的副本推送到队列上
               ajaxRequestQueue.push($.extend(true, {}, settings));
           }
           否则如果（ajaxRequestQueue.length > 0
                && isProcessingQueue === false)
           // 队列中有调用，我们自己还没有触发“ajaxSend”
           {
               处理请求队列();
           }
       });
   
       // 绑定以在浏览器重新上线时开始处理队列
       window.addEventListener("在线", processRequestQueue);
   })(jQuery，窗口)
   

Answer 2

好吧，你可以使用 jQuery 克隆对象，然后在浏览器重新上线时重新启动你的调用

// Deep copy
var savedXhr= jQuery.extend(true, {}, xhr);

，不知道这是否真的有效，你可以尝试一下

编辑 - 好吧，我尝试过，但没办法，你不能调用 send()在那个物体上。这是因为 xhr 不是原始请求，而是 jQuery 创建的“假”对象
另一种方法可能是这样的：保存设置对象，然后使用以下命令启动另一个 $.ajax 调用
那些设置。
基本上你做

var settingsSaved;

$(document).ajaxSend(function(event, xhr, settings, response) {
    if (!navigator.onLine) {
        settingsSaved = jQuery.extend(true, {}, settings);
        xhr.abort();
    } else {
        //Send the request with the old settings
        $.ajax(settingsSaved);
        //abort the new request
        xhr.abort();
    }
}

请务必小心，这需要精确的流量控制，因为每次调用 $.ajax 时都会触发另一个 ajaxSend 事件...也许您可以简单地使用以下命令开始一个新的 XMLHTTPRequest来自 settingsSaved 对象的值。

看看这个小提琴，第一次单击按钮时，调用就会中止。第二次调用以旧设置开始，从那时起所有请求都正常

http://jsfiddle.net/hFmWX/