快速发送时不接收异步AJAX请求

Question

我的脚本正在将GET请求发送到页面（ http://example.org/getlisting/ ），然后页面反过来以JSON对象作为响应。 （ {"success":true, "listingid":"123456"} ）

这是一个示例片段：

var listingAjax = new XMLHttpRequest();
listingAjax.addEventListener("load", listingCallback, false);

function listingCallback(event) {
    if (this.readyState == 4 && this.status == 200) {
       console.log(this.responseText);
    }
}

listingAjax.open("GET", "http://example.org/getlisting/", true);
listingAjax.send();

很简单。 该脚本也可以完美运行！ 我要执行此操作时会出现问题：

var listingAjax = new XMLHttpRequest();
listingAjax.addEventListener("load", listingCallback, false);

function listingCallback(event) {
    if (this.readyState == 4 && this.status == 200) {
       console.log(this.responseText);
    }
}

window.setInterval(function() {
    listingAjax.open("GET", "http://example.org/getlisting/", true);
    listingAjax.send();
}, 250);

我想应该发生的是我的脚本将创建稳定的GET请求流，该请求将发送到服务器，然后服务器对每个请求进行响应。 然后，我的脚本将接收服务器的响应并将其发送到回调。

更确切地说，假设我让此脚本运行5秒钟，并且我的脚本在那个时候向服务器发送了20个GET请求。 我希望我的回调（ listingCallback ）也将被调用20次。

问题是，不是。 几乎看起来，如果我在从服务器收到响应之前发出了两个GET请求，则该响应将被忽略或丢弃。

我在做什么错/误解呢？

Answer 1

许多浏览器在每个服务器中内置了最大数量的开放HTTP连接。 您可能正在撞墙？

这是Mozilla的示例，但大多数浏览器都应内置以下内容： http : //kb.mozillazine.org/Network.http.max-connections-per-server

有关Chrome的一个较早的问题：将Google Chrome的每服务器最大连接数限制提高到6个以上

如果您使用的是Windows，请查看Fiddler之类的工具-您可能能够查看所有请求是否实际上都已发出，或者浏览器是否正在排队/杀死其中的一些请求。

Answer 2

在进行连接时，您不能重用同一个XMLHttpRequest对象来open新连接，否则将导致突然abort离子（在Chrome中测试）。 对每个调用使用新的XMLHttpRequest对象将解决以下问题：

function listingCallback(event) {
    if (this.readyState == 4 && this.status == 200) {
       console.log(this.responseText);
    }
}

window.setInterval(function() {
    var listingAjax = new XMLHttpRequest();
    listingAjax.addEventListener("load", listingCallback, false);
    listingAjax.open("GET", "http://example.org/getlisting/", true);
    listingAjax.send();
}, 250);

这将很好地为每个间隔排队一个新的ajax请求。

小提琴

请注意，由于每个浏览器固有的并发ajax调用的最大限制，过于频繁的调用可能会导致速度降低。
但是，现代浏览器有一个相当不错的限制，并且具有很好的并行性，因此，只要您仅获取一个小的JSON对象，即使使用拨号，现代浏览器也应该能够保持同步。

上一次创建ajax轮询脚本时，我将在前一个请求的成功处理程序中启动一个新请求，而不是使用一个间隔，以最大程度地减少ajax调用。 虽然不确定此逻辑是否适用于您的应用程序。