Каков наилучший метод обнаружения автономного режима в браузере?

Question

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

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

Итак, что является лучшим способом сделать это?

Answer 1

Одним из способов обработки этого может быть расширение объекта 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); 
    } 
}); 

Answer 2

navigator.onLine 

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

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

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

Answer 3

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

Answer 4

См. the HTML 5 draft specification. Вы хотите navigator.onLine. Не все браузеры поддерживают его еще. Firefox 3 и Opera 9.5.

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

Answer 5

Хм, на самом деле, теперь я немного заглядываю в него, это немного сложнее, чем это. Прочтите эти ссылки на John Resig's blog и Mozilla site. У вышеупомянутого плаката также может быть хорошая точка - вы все равно делаете запросы, поэтому вы должны иметь возможность работать, когда они терпят неудачу. Это может быть гораздо более надежный способ.

Answer 6

Я думаю, что у google gears есть такая функциональность, возможно, вы можете проверить, как они это сделали.

Answer 7

Позвоните в надежное место назначения или, возможно, в ряд вызовов, которые должны пройти и вернуться, если у пользователя есть активное сетевое соединение - даже что-то такое же простое, как токен ping для google, yahoo и msn , или что-то типа того. Если хотя бы один возвращается зеленым, вы знаете, что вы подключены.

Answer 8

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

Answer 9

Используйте соответствующий API HTML5: online/offline status/events.

Answer 10

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