Поддержка разработки веб-приложений в автономном режиме — еще одно направление HTML5. Так называемые автономные веб-приложения — это приложения, которые могут работать даже тогда, когда устройство не имеет доступа к Интернету.
Разработка автономных веб-приложений требует нескольких шагов. Во-первых, нужно убедиться, что приложение знает, есть ли у устройства доступ к Интернету, чтобы оно могло предпринять правильные действия в дальнейшем. Кроме того, для правильной работы приложение также должно иметь доступ к определенным ресурсам (изображениям, Javascript, CSS и т. д.). Лучше всего, чтобы у пользователей было локальное пространство для сохранения данных, и чтение и запись не будут затруднены независимо от того, есть ли у них доступ к Интернету.
HTML5 и связанные с ним API делают разработку автономных приложений реальностью.
Автономное обнаружениеЧтобы узнать, находится ли устройство в сети или в автономном режиме, HTML5 определяет атрибут navigator.onLine. Значение true указывает, что устройство может иметь доступ к Интернету, а значение false указывает, что устройство находится в автономном режиме.
if (navigator.onLine) { // Работаем нормально} else { // Выполняем задачи в автономном режиме}Поскольку у navigator.onLine есть определенные проблемы совместимости, в дополнение к атрибуту navigator.onLine, чтобы лучше определить, доступна ли сеть, HTML5 также определяет два события: онлайн и офлайн.
Эти два события запускаются в объекте окна, когда сеть переключается между автономным и онлайн-режимом:
window.addEventListener('online', function() { // Работает нормально}); window.addEventListener('offline', function() { // Выполняет задачи в автономном режиме});В практических приложениях исходное состояние лучше всего получать через navigator.onLine после загрузки страницы. Затем используйте два вышеуказанных события, чтобы определить, изменилось ли состояние сетевого подключения. При срабатывании вышеуказанного события значение свойства navigator.onLine также изменится, но это свойство необходимо опросить вручную, чтобы обнаружить изменения в состоянии сети.
кэш приложенияКэш приложений HTML5, или сокращенно appcache, специально разработан для разработки автономных веб-приложений. Appcache — это область кэша, отделенная от кэша браузера. Чтобы сохранить данные в этом кэше, используйте файл манифеста, в котором перечислены ресурсы, которые необходимо загрузить и кэшировать. Пример файла описания:
МАНИФЕСТ КЕША# Commentfile.jsfile.css
Затем процитируйте в html:
<html манифест=./xxx.manifest>
Тип MIME файла xxx.manifest должен быть text/cache-manifest.
Ядром этого API является объект applicationCache. Этот объект имеет атрибут status. Значение атрибута является константой, указывающей следующее текущее состояние кэша приложения.
Связанные события:
Вообще говоря, эти события будут запускаться в указанном выше порядке по мере загрузки страницы. Вышеупомянутые события также можно вызвать вручную, вызвав метод update().
хранение данных Файлы cookieФайлы cookie HTTP, обычно называемые непосредственно файлами cookie, используются клиентом для хранения информации о сеансе. Стандарт требует, чтобы сервер отправлял HTTP-заголовок Set-Cookie как часть ответа на любой HTTP-запрос, который содержит информацию о сеансе. Пример заголовка ответа сервера:
HTTP/1.1 200 ОК
Тип контента: текст/html
Set-Cookie: имя=значение
Other-header: значение другого-заголовка
Затем браузер Set-Cookies сохраняет информацию о сеансе, а затем добавляет HTTP-заголовок Cookie к каждому запросу для отправки информации обратно на сервер, как показано ниже:
ПОЛУЧИТЬ /index.html HTTP/1.1
Файл cookie: имя = значение
Other-header: значение другого-заголовка
Дополнительная информация, отправленная обратно на сервер, может использоваться для однозначной проверки того, по какому запросу пришел клиент.
Полноценные файлы cookie включают в себя: