Ajax jQuery多个调用同时等待很长时间等待应答，无法取消。

Question

我的问题如下：

• 在一个页面上，我正在执行多个ajax调用(通过jQuery)同时获取一些数据(使用php包装器通过调用获取数据)。
• 这些请求同时进行，需要10-20秒才能完成。
• 如果用户单击到其他地方的任何链接(到其他页面)，我可以看到所有未完成的调用都被取消了。
• 然而，浏览器仍然要等待20秒才能导航到另一个页面--就好像它仍然在等待最长的调用完成，即使它被取消了。

(在Chrome和Firefox中也发生了同样的问题，ajax调用是异步的.我尝试设置ajax超时，在ajax错误响应中捕获readystate=o，甚至试图与webworkers做一些事情，但都没有结果)

任何洞察力都会有帮助

谢谢!

Answer 1

这是由于浏览器的maximum number of connections到单个域。

请参阅棕镜以获取每个浏览器的哺乳期。

• IE 8+9: 6个连接
• IE 10: 8连接
• Chrome 26: 6连接
• Firefox 21: 6连接

您可以做的是收集所有的Defferred对象，并在用户单击链接时取消它们。

示例：

// some ajax calls
doAjax({});
doAjax({});

var requests = [];

// helper function to perform and register calls
function doAjax(options) {
    var jqXHR= $.ajax(options);
    requests.push(jqXHR);
    jqXHR.always(function(jqXHR) {
         var index = requests.indexOf(jqXHR);
         if (index!=-1) {
             requests.splice(index, 1);
         }
    });
}

// function to abort all calls
// when your application has a router to provide navigation, this function
// is typically called when you navigate to another page
function abortAllPendingRequests() {
    var i;
    for (i=0; i<requests.length; i++) {
        var xhr = requests[i];
        // already finished calls (readyState 4) should not be aborted
        if (xhr.readyState != 4) {
            xhr.abort();
        }
    }
};

当用户试图导航到另一个页面时，剩下的就是调用abortAllPendingRequests函数。

当您有某种router (例如，Backbone.Router)时，您可以在那里调用它。

如果应用程序没有用于导航的router，但使用普通锚链接，则可以在调用abortAllPendingRequests函数的链接中添加一个onClick。