Question

我搜索了stackoverflow但得到了相互矛盾的答案：

Why should I reuse XmlHttpRequest objects?

Ajax-intensive page: reuse the same XMLHttpRequest object or create new one every time?

此外，还有关于w3schools.com的建议：

如果您的网站上有多个AJAX任务，则应创建一个标准函数，用于创建XMLHttpRequest对象，并调用这适用于每个AJAX任务。

为何推荐这个？我在我的页面上使用全局XMLHttpRequest对象来处理所有Ajax任务。

Answer 1

你误解了W3School的推荐。我将重点介绍相关部分：

如果您的网站上有多个AJAX任务，则应创建 ONE标准功能 以创建XMLHttpRequest对象，并为每个AJAX任务调用此<。 / p>

它表示您使用一个AJAX函数来获取请求。此函数将处理IE和其他浏览器之间的不一致。符合标准的浏览器中为XMLHttpRequest，IE中为ActiveXObject。

我建议使用多个XHR对象。使用一个全局xhr对象，您的应用程序只能在给定时间处理一个请求。它也容易出错（例如。XMLHttpRequest launches multiple times without initiating the onreadystatechange function）。

W3schools意味着：

function createXHR() {
    try {
        return new XMLHttpRequest();
    } catch (e) {
        try {
            return new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e) {
            return new ActiveXObject("Msxml2.XMLHTTP");
        }
    }
}
var xhr = createXHR();
xhr.open('get', '/test', true);
xhr.send();

虽然最好创建一个处理请求的函数，例如jQuery.ajax。

Answer 2

最好为您正在制作的每个XHR使用不同的对象。即使有办法，也要避免它！为每个请求创建新对象没有问题。如果您担心内存泄漏或类似的东西，请不要担心，它们都是正确的GC。。

如果您的网站上有多个AJAX任务，您应该创建一个标准函数来创建XMLHttpRequest对象，并为每个AJAX任务调用它。

它实际上意味着您有一个创建新对象的函数，并在每次调用它时返回它。它类似于：

function newXHR(){
    return a new instance of XHR();
}

Answer 3

你强调的建议是说你应该有一个处理AJAX的FUNCTION，而不是特别是一个XMLHTTPRequest对象。

我会为每个问题使用不同的一个。

反对这一点的常见论点涉及设置XHR所涉及的开销。然而，在使用AJAX的任何站点中，这几乎可以忽略不计（即，不是作为Web套接字的劳动力替代品），并且在任何情况下，大多数相同的开销将适用于重新使用XHR。你仍然需要打开连接，激活它，连接听众等。

浏览器在给定时间允许的连接网关数量方面各不相同，因此浏览器可以控制XHR可以执行哪些操作。换句话说，您不必担心管理这方面。

最后，没有什么能阻止你在使用XHR之后手动删除XHR，只要它们是可删除的（对象的属性而不是变量）。

Answer 4

我正在使用这样的模式

var xhrSendBuffer = new Object();
function sendData(url, model) {
    if (!xhrSendBuffer[url]) {
        let xhr = new XMLHttpRequest();
        xhr.onloadend = xhrDone;
        xhr.error=xhrError;
        xhr.onabort = xhrAbborted;
        xhr.open('POST', url, true);
        xhr.setRequestHeader('Content-Type', 'application/json; charset=utf-8');
        xhrSendBuffer[url] = xhr;
    }

    xhrSendBuffer[url].send(JSON.stringify(model));
}

function xhrDone(e) {
    console.log(e);
}
function xhrError(e) {
    console.error(e);
}
function xhrAbborted(e) {
console.warn(e);
}

如果由于在同一站点上发送了多个请求而最终在自己的站点上产生了DOS，则可以使用xhr.readyState在发送下一个请求之前查看其繁忙程度，但是我还没有遇到一个问题。

重用XMLHttpRequest对象还是创建一个新对象？

4 个答案: