获取浏览器是否繁忙

Question

我正在尝试找到一种方法来获取浏览器当前是否正忙于 JavaScript。我正在考虑制作一个 Firefox 扩展，以在当前页面正在加载某些内容（通过 ajax 或只是正常页面加载）时注入布尔值或其他内容，或者使用 Greasemonkey 脚本或通过某些 JavaScript API（这将是最好的解决方案，但据我所知，不存在这样的解决方案）。

我想知道做到这一点的最佳方法是什么。我一直在寻找 Firefox Addon / Greasemonkey 教程来制作类似的东西，但找不到任何东西。有谁有任何提示或资源可以为我指出或更好的解决方案来解决这个问题？

谢谢

编辑：由于忙碌，我主要只需要知道浏览器是否正在从服务器发送或接收数据。

Answer 1

jQuery，一个用于 DOM 操作和执行 ajax 调用的出色 javascript 框架，提供了两个出色的钩子来确定 ajax 调用何时正在进行：

$.ajaxStart() 和 $.ajaxStop()

这两个钩子都采用一个处理函数，当 ajax 调用即将发生时，该函数将被调用分别在开始时和所有 ajax 调用停止时。这些函数可以绑定到页面上的任何元素。您可以在 $.ajaxStart() 处理程序中将全局布尔值设置为 true，并在 $.ajaxStop() 处理程序中将其设置回 false。

然后，您可以检查该布尔标志并确定 ajax 调用是否正在进行。

沿着这些思路：

$(document).ajaxStart(function() {
    window.ajaxBusy = true;
});

$(document).ajaxStop(function() {
    window.ajaxBusy = false;
});

就确定浏览器何时加载当前页面而言，您可以检查
document.readyState。当文档加载时，它返回一个 "loading" 字符串，加载后返回一个 "complete" 字符串。您可以将处理程序绑定到 document.onreadystatechange 并设置一个全局布尔值来指示文档是否仍在加载。

像这样的东西：

document.onreadystatechange = function() {
    switch (document.readyState) {
        case "loading":
            window.documentLoading = true;
            break;
        case "complete":
            window.documentLoading = false;
            break;
        default:
            window.documentLoading = false;
    }
}   

编辑：

看来 $.ajaxStart() 和 $.ajaxStop() 不适用于没有 jQuery 的 ajax 调用。所有 XMLhttprequest 对象都有一个名为 readystatechange 的事件，您可以将处理程序附加到该事件。您可以利用此功能来确定单个呼叫是否完成。您可以将对未完成调用的所有引用推送到数组上，并在 setInterval() 中检查该数组的长度。如果它> 1、存在未决的ajax调用。这是一种粗略的方法，而且只是实现这一目标的一种方法。可能还有其他方法可以做到这一点。但一般方法如下：

// declare array to hold references to outstanding requets
window.orequets = [];

var req = XMLHttpRequest(); 
// open the request and send it here....
// then attach a handler to `onreadystatechange`
req.onreadystatechange = function() {
    if (req.readyState != 4 || req.readyState != 3) {
        // req is still in progress
        orequests.push(req);
        window.reqPos = orequests.length -1
    } else {
        window.orequests = orequests.slice(reqPos, reqPos + 1);
    }
}

对您将发送的每个 XMLHttpRequest() 执行上述操作，当然还要更改每个请求的名称。然后运行一个 setInterval()，每 x 毫秒运行一次，并检查 orquests 的长度属性。如果它等于零，则没有请求发生，如果它大于零，则请求仍在发生。如果没有请求发生，您可以通过 clearInterval() 清除间隔或保持其运行。

你的 setInterval 可能看起来像这样：

var ajaxInterval = setInterval(function() {
    if (orequests.length > 0) {
      // ajax calls are in progress
      window.xttpBusy = true;
    } else {
      // ajax calls have ceased
      window.xttpBusy = false;
      // you could call clearInterval(ajaxInterval) here but I don't know if that's your intention
    },
    3000 // run every 3 seconds. (You can decide how often you want to run it)
}); 

Answer 2

这就是我想我最终会做的事情。此解决方案类似于 Alex 建议的 Jquery 事件解决方案，不同之处在于它适用于任何使用 XMLHttpRequest（包括 Jquery）的内容：

var runningAjaxCount = 0;

var oldSend = XMLHttpRequest.prototype.send;
XMLHttpRequest.prototype.send = function() {
    oldOnReady = this.onreadystatechange;
    this.onreadystatechange = function() {
        oldOnReady.call(this);
        if(this.readyState == XMLHttpRequest.DONE) {
            ajaxStopped();
        }
    }
    ajaxStarted();
    oldSend.apply(this, arguments);
}

function ajaxStarted() {
    runningAjaxCount++;
}

function ajaxStopped() {
    runningAjaxCount--;
}

function isCallingAjax() {
    return runningAjaxCount > 0;
}

function isBrowserBusy() {
    return document.readyState != "complete" && isCallingAjax();
}

Answer 3

从技术上讲，浏览器从来都不是“忙”的。商业是一个非常主观的术语。我们假设主线程正在执行一个简单的 while 循环，该循环会阻止执行。这可以被认为是繁忙，但是如果您有这样的情况该怎么办：

function busy() {setTimeout(busy, 0);do_something();}
busy();

浏览器本身没有被阻止，因此页面是否“繁忙”非常不清楚。而且，这甚至还没有开始触及网络工作者和 Chrome 中的代码。

你将很难做到这一点，即使你这样做了，它也可能不会像你期望的那样工作。不过，祝你好运。