在浏览器中检测脱机模式的最佳方法是什么?

处理此问题的一种方法可能是使用显式超时方法扩展XMLHttpRequest对象,然后使用该方法确定是否在脱机模式下工作(即,对于不支持navigator.online的浏览器)。以下是我如何在一个站点(使用 Prototype 图书馆)。10秒(10000毫秒)后,它中止调用并调用OnFailure方法。

/**
 * Monitor AJAX requests for timeouts
 * Based on the script here: http://codejanitor.com/wp/2006/03/23/ajax-timeouts-with-prototype/
 *
 * Usage: If an AJAX call takes more than the designated amount of time to return, we call the onFailure
 *        method (if it exists), passing an error code to the function.
 *
 */

var xhr = {
    errorCode: 'timeout',
    callInProgress: function (xmlhttp) {
        switch (xmlhttp.readyState) {
            case 1: case 2: case 3:
                return true;
            // Case 4 and 0
            default:
                return false;
        }
    }
};

// Register global responders that will occur on all AJAX requests
Ajax.Responders.register({
    onCreate: function (request) {
        request.timeoutId = window.setTimeout(function () {
            // If we have hit the timeout and the AJAX request is active, abort it and let the user know
            if (xhr.callInProgress(request.transport)) {
                var parameters = request.options.parameters;
                request.transport.abort();
                // Run the onFailure method if we set one up when creating the AJAX object
                if (request.options.onFailure) {
                    request.options.onFailure(request.transport, xhr.errorCode, parameters);
                }
            }
        },
        // 10 seconds
        10000);
    },
    onComplete: function (request) {
        // Clear the timeout, the request completed ok
        window.clearTimeout(request.timeoutId);
    }
});

navigator.onLine

那应该按你的要求做。

您可能想检查您拥有的任何更新页面的代码。如:

if (navigator.onLine) {
    updatePage();
} else {
    displayOfflineWarning();
}

你好像回答了自己的问题。如果小工具发送异步请求,并且超时,则不要更新它们。如果有足够多的用户这样做,则显示“page is offline”(页面脱机)消息。

见 the HTML 5 draft specification . 你想要 navigator.onLine . 不是所有的浏览器都支持它。火狐3和Opera 9.5可以。

听起来你好像是在掩盖问题,而不是解决问题。如果一个失败的请求导致小部件清除数据,那么您应该修复代码,这样它就不会试图更新小部件,除非它收到响应,而不是试图确定请求是否会提前成功。

嗯,事实上,现在我看了一点,比这复杂一点。在上阅读这些链接 John Resig's blog 以及 Mozilla site .上面的海报可能也有一个很好的观点——你无论如何都在提出请求,所以当他们失败时你应该能够解决问题。这可能是一种更可靠的方式。

给一个可靠的目的地打个电话,或者一系列的电话,如果用户有一个活跃的网络连接的话,这些电话应该通过并返回——即使是像向Google、Yahoo和MSN发送令牌这样简单的电话,或者类似的电话。如果至少有一个恢复为绿色,你就知道你已经连接上了。

我认为GoogleGears有这样的功能,也许你可以看看他们是怎么做到的。

使用相关的HTML5 API: online/offline status/events .

谢谢你的回复。我将尝试用我最后做的事情来更新这个问题。

一种可能的解决方案是,如果页面和缓存页面具有不同的URL,则只需查看并查看您所在的URL。如果您在缓存页面的URL上,则处于脱机模式。 This 博客指出了为什么navigator.online会破产。