Каков наилучший способ обнаружения автономного режима в браузере? - PullRequest
3 голосов
/ 18 сентября 2008

У меня есть веб-приложение, в котором есть несколько компонентов Ajax, которые часто обновляются внутри страницы (это своего рода панель инструментов).

Теперь я хочу добавить функциональность на страницу, чтобы при отсутствии подключения к Интернету текущее содержимое страницы не менялось, и на странице появлялось сообщение о том, что страница отключена (в настоящее время, так как они различные гаджеты на странице пытаются обновить себя и обнаруживают, что подключение отсутствует, их старые данные исчезают).

Итак, как лучше всего это сделать?

Ответы [ 10 ]

12 голосов
/ 18 сентября 2008
navigator.onLine

Это должно сделать то, что вы просите.

Возможно, вы захотите проверить это в любом коде, который обновляет страницу. Например:

if (navigator.onLine) {
    updatePage();
} else {
    displayOfflineWarning();
}
4 голосов
/ 18 сентября 2008

См. проект спецификации HTML 5 . Вы хотите navigator.onLine. Не все браузеры поддерживают это пока. Firefox 3 и Opera 9.5 делают.

Звучит так, будто вы пытаетесь скрыть проблему, а не решить ее. Если неудачный запрос заставляет ваши виджеты очистить свои данные, вам следует исправить код, чтобы он не пытался обновить ваши виджеты, пока не получит ответ, вместо того, чтобы пытаться выяснить, будет ли запрос выполнен заранее.

4 голосов
/ 18 сентября 2008

Похоже, вы ответили на свой вопрос. Если гаджеты отправляют асинхронный запрос и время его ожидания не обновляется. Если их достаточно, отобразите сообщение «Страница не в сети».

3 голосов
/ 19 сентября 2008

Одним из способов справиться с этим может быть расширение объекта XmlHTTPRequest с помощью явного метода тайм-аута, а затем использовать его, чтобы определить, работаете ли вы в автономном режиме (то есть для браузеров, которые не поддерживают navigator.onLine). Вот как я реализовал тайм-ауты Ajax на одном сайте (сайте, который использует библиотеку Prototype ). Через 10 секунд (10 000 миллисекунд) он прерывает вызов и вызывает метод 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);
    }
});
2 голосов
/ 19 сентября 2008

Сделайте звонок в надежный пункт назначения, или, возможно, серию звонков, которые должны проходить и возвращаться, если у пользователя есть активное сетевое соединение - даже что-то такое же простое, как пинг токенов для Google, Yahoo и MSN, или что-то типа того. Если хотя бы один из них возвращается зеленым, значит, вы подключены.

2 голосов
/ 18 сентября 2008

Хм, на самом деле, теперь я немного разбираюсь, это немного сложнее, чем это. Прочитайте эти ссылки на блоге Джона Ресига и на сайте Mozilla . Приведенный выше плакат также может иметь хорошую точку зрения - вы в любом случае делаете запросы, поэтому вы должны иметь возможность работать, когда они терпят неудачу. Это может быть гораздо более надежный путь.

1 голос
/ 21 апреля 2010

Используйте соответствующий HTML5 API: онлайн / офлайн статус / события .

1 голос
/ 19 сентября 2008

Я думаю, у Google Gears есть такая функциональность, может быть, вы могли бы проверить, как они это сделали.

0 голосов
/ 15 июня 2012

Одно из возможных решений заключается в том, что если страница и кэшированная страница имеют разные URL, просто посмотрите и посмотрите, по какому URL вы находитесь. Если вы находитесь на URL кэшированной страницы, то вы находитесь в автономном режиме. В этом блоге рассказывается о том, почему нарушен navigator.online

0 голосов
/ 19 сентября 2008

Спасибо за все ответы. Я попытаюсь обновить вопрос тем, что я в итоге делал.

...