Делаем приложение HTML5 доступным в автономном режиме

Я работаю над HTML-приложением для клиента. Весь внешний интерфейс приложения состоит из 1 файла HTML, 1 файла Javascript, 1 файла CSS (плюс jquery) и нескольких изображений. На сервере есть несколько php-скриптов, которые вызываются с использованием AJAX, но только при наличии подключения к Интернету. Если соединение недоступно, то сайт будет использовать локально кэшированные данные (используя localStorage).

Чтобы сделать сайт доступным в автономном режиме, я объявляю манифест кеша в своем HTML. Мой HTML выглядит так:

<!DOCTYPE html>
<html manifest="cache.manifest.php" language="en">
...
</html>

Вывод cache.manifest.php выглядит следующим образом:

CACHE MANIFEST
#VersionHash: 80b9345e6c39efbbe8431e394b014b4f

CACHE:
/css/ebot.css
/favicon.ico
/images/appicon.png
/images/list-arrow.png
/images/list-checkmark.png
/images/woman.png
/index.html
/js/jquery-1.8.3.min.js
/js/ebot.ls.js

NETWORK:
/emaillog.php
/getdata.php
/uploadlog.php

Все идет нормально. Теперь я захожу на сайт из браузера с доступным подключением к Интернету. Я получаю небольшое уведомление с вопросом, разрешить ли сайту хранить информацию для использования в автономном режиме - я разрешаю. Когда я проверяю настройки, я вижу, что на сайте хранится 316 КБ данных - примерно так.

Теперь я отключаю интернет-соединение и пытаюсь получить доступ к http://www.mysite.com/index.html - и получаю сообщение об ошибке «Интернет-соединение недоступно» (или что-то в этом роде), и страница не отображается. Это происходит в 3 браузерах, которые я тестировал на своей машине разработки (firefox, safari и chrome), а также на клиентском ipad (приложение в конечном итоге предназначено для использования на ipad).

Что мне здесь не хватает? Что я делаю неправильно?


person Aleks G    schedule 18.12.2012    source источник
comment
Не ответ, но вы сталкивались с этой статьей? alistapart.com/articles/application-cache-is-a-douchebag В нем рассказывается о множестве подводных камней, связанных с использованием appcache.   -  person net.uk.sweet    schedule 19.12.2012


Ответы (1)


Для этого может быть много причин. Взгляните на эти статьи:

Я предполагаю, что вы не указали правильный тип контента (MIME) для своего манифеста. Это должен быть «текст/кеш-манифест». Проверьте события в консоли в Chrome. Вы должны увидеть что-то вроде этого, когда манифест appcache правильный:

Создание кэша приложения с манифестом http://example.com/manifest.appcache
Событие проверки кэша приложения
Событие Application Cache Downloading
Событие Application Cache Progress (ГГГ из XXX)
Событие Application Cache Cached

Я бы предложил начать с самого простого манифеста, чтобы убедиться, что манифест проанализирован. Пытаться:

CACHE MANIFEST
NETWORK:
*

такой манифест должен кэшировать только вашу стартовую html-страницу.

person Shrike    schedule 24.01.2013
comment
Манифест создается программой php, которая явно устанавливает правильный тип содержимого. Я проверил как в Chrome, так и в Firefox (с Firebug). Поэтому это определенно что-то другое. - person Aleks G; 24.01.2013
comment
Как вы проверяли? Chrome не показывает получение манифеста appcahce на вкладке «Сеть» своих инструментов разработки. Вы указали браузеру напрямую cache.manifest.php? Также убедитесь, что HTTP-кеширование не выполняется (добавьте соответствующие заголовки при возврате манифеста на ваш сервер) - person Shrike; 25.01.2013
comment
Прежде всего, я проверил, загрузив cache.manifest.php напрямую. Во-вторых, я получаю всплывающую панель с сообщением о том, что сайт хочет сохранить данные для автономного использования, на что я отвечаю «да». Это означает, что браузер понимает кеш. - person Aleks G; 25.01.2013
comment
Видите ли вы свой кеш на вкладке «Ресурсы» в инструментах разработки Chrome? Там есть раздел Application Cache. - person Shrike; 25.01.2013