在JavaScript中，我如何测试在给定时刻是否有AJAX调用在后台运行

In JavaScript, how can I test if any AJAX call is running in the background at a given moment?

本文关键字：是否 时刻 定时 AJAX 运行 后台 调用 测试 JavaScript 何测试      更新时间：2023-09-26

我必须使用原生javascript(尽管如果我将其转换为原生javascript, jQuery解决方案也可以工作)。

此外，我没有处理现有的AJAX请求，所以我不能直接访问它们。

我正在搜索如下内容:

var ajaxRequestsInProgress = document.getAllAjaxRunning();
ajaxRequestsInProgress[1].getStatus(); // will return the status of the request, for example

所以我可以访问这个对象并检查/操作现有的ajax请求

我们应该说，这有点棘手。没有原生的方法可以做到这一点。所以我们需要做一些修改，修改原生的XMLHttpRequest函数。像这样:

var getAJAXRequests = (function() {
    var oldSend = XMLHttpRequest.prototype.send,
        currentRequests = [];
    XMLHttpRequest.prototype.send = function() {
        currentRequests.push(this); // add this request to the stack
        oldSend.apply(this, arguments); // run the original function
        // add an event listener to remove the object from the array
        // when the request is complete
        this.addEventListener('readystatechange', function() {
            var idx;
            if (this.readyState === XMLHttpRequest.DONE) {
                idx = currentRequests.indexOf(this);
                if (idx > -1) {
                    currentRequests.splice(idx, 1);
                }
            }
        }, false);
    };
    return function() {
        return currentRequests;
    }
}());

可以用getAJAXRequests()来调用。

你可以在jsFiddle上看到它的作用

我知道你没有特别要求Mootools解决方案，但我已经做了类似的事情，我想我将在这里分享给其他人参考。我通过覆盖各种请求方法来实现这一点。我目前使用的是1.5.1版本，但这或类似的东西应该在其他版本上工作。

(function() {
    var requestCounter = 0,
        send = Request.prototype.send,
        cancel = Request.prototype.cancel,
        onSuccess = Request.prototype.onSuccess,
        onFailure = Request.prototype.onFailure,
        timeout = Request.prototype.timeout;
    var increment = function() {
        ++requestCounter;
    };
    var decrement = function() {
        --requestCounter;
        if (requestCounter < 0) {
            requestCounter = 0;
        }
    };
    Request.implement({
        send: function() {
            increment();
            return send.apply(this, arguments);
        },
        cancel: function() {
            decrement();
            return cancel.apply(this, arguments);
        },
        onSuccess: function() {
            decrement();
            return onSuccess.apply(this, arguments);
        },
        onFailure: function() {
            decrement();
            return onFailure.apply(this, arguments);
        },
        timeout: function() {
            decrement();
            return timeout.apply(this, arguments);
        }
    });
    Request.getRunningCount = function() {
        return requestCounter;
    };
})();

现在，每次发出请求时，计数器将增加，当它完成时，它将减少。

var request1 = new Request(...);
var request2 = new Request(...);
request1.send();
request2.send();
console.log(Request.getRunningCount()); // 2
request1.cancel();
console.log(Request.getRunningCount()); // 1
// request2 completes
console.log(Request.getRunningCount()); // 0
相关文章：