С кэшем приложения легко сделать автономную версию веб-приложения, путем создания кэш-файла манифеста.
Что такое Application Cache?
HTML5 вводит кэша приложений, а это означает, что веб-приложение в кэше, и доступны без подключения к интернету.
Кэш приложений дает приложению три преимущества:
- Автономный просмотр - пользователи могут использовать приложение, когда они форум
- Скорость - кэшировать ресурсы загружаются быстрее
- Снижение нагрузки на сервер - браузер будет только загрузить обновленные / измененные ресурсы сервера
Задний план
Веб-приложения состоят из веб-страниц, которые должны быть загружены из сети. Для того чтобы это произошло, должно быть подключение к сети. Тем не менее, есть много случаев, когда пользователи не могут подключиться к сети из-за обстоятельства вне их контроля. HTML5 предоставляет возможность получить доступ к веб-приложения, даже без подключения к сети, используя манифест кэша.
Веб-приложения состоят из ресурсов, определенных URL. Это может быть HTML, CSS, JavaScript, изображения или любого другого источника, который требуется для веб-приложений, которые будут оказаны. Их адреса можно скопировать в файл манифеста, который может регулярно обновляться автором веб-приложения, указывая на какие-либо новые веб-адреса, которые были добавлены или удалены. При подключении к сети в первый раз, веб-браузер будет читать файл манифеста HTML5, загрузить ресурсы, данные и хранить их локально. Затем, при отсутствии подключения к сети, веб-браузер будет смещаться в локальных копий, а и визуализации в автономном режиме веб-приложений.
Поддержка браузеров
Числа в таблице указать первую версию браузера, который полностью поддерживает Application Cache.
| API | |||||
|---|---|---|---|---|---|
| Application Cache | 4,0 | 10,0 | 3,5 | 4,0 | 11,5 |
HTML - кэш Manifest Пример
В приведенном ниже примере показан HTML - документ с манифестом кэша (for offline browsing) :
пример
<!DOCTYPE HTML>
<html manifest="demo.appcache">
<body>
The content of the document......
</body>
</html> Попробуй сам " Кэш Manifest Основы
Для того чтобы автономных приложений для работы, кэш файл манифеста должен быть создан веб-разработчика. Если веб-приложение превышает более чем на одной странице, то каждая страница должна иметь явный атрибут, который указывает на манифест кэша. Каждая страница ссылается манифест будет храниться локально. Файл манифеста кэша представляет собой текстовый файл, расположенный в другой части сервера. Он должен быть подан со следующим содержанием типа:
text/cache-manifest
Чтобы включить кэш приложения, включите manifest атрибута в документе <html> тега:
<!DOCTYPE HTML>
<html manifest="demo.appcache">
...
</html>
Каждая страница с manifest атрибутом указанного кэшируются , когда пользователь посещает его. Если manifest атрибут не указан, то страница не будет кэшировать (unless the page is specified directly in the manifest file) .
Рекомендуемое расширение файла для файлов манифеста является: ".appcache"
Файл манифеста должен быть подан с correct media type , который является "text/cache-manifest" . Должен быть настроен на веб-сервере.
Файл манифеста
Файл манифеста представляет собой простой текстовый файл, который сообщает браузеру , что кэш (and what to never cache) , (and what to never cache) .
Файл манифеста состоит из трех разделов:
- CACHE MANIFEST - файлы перечислены в этом заголовке будет кэшируются после их загрузки в первый раз
- NETWORK - Файлы перечислены в этом заголовке требуется подключение к серверу, и никогда не будет кэшировать
- FALLBACK - Файлы перечислены в этом заголовке указывает замещающего страницы , если страница недоступна
CACHE MANIFEST
Первая линия, CACHE MANIFEST, требуется:
CACHE MANIFEST
/theme.css
/logo.gif
/main.js
Файл манифеста выше перечислены три ресурса: а CSS файл, будет GIF изображений и файлов JavaScript. Когда манифест загружен файл, браузер загружает три файла из корневого каталога веб-сайта. Затем, когда пользователь не подключен к Интернету, то ресурсы будут по-прежнему доступны.
СЕТЬ
Раздел NETWORK ниже указывает , что файл "login.asp" никогда не должно быть в кэше, а не будут доступны в автономном:
NETWORK:
login.asp
Звездочка может использоваться, чтобы указать, что все другие ресурсы / файлы требуют подключения к Интернету:
NETWORK:
*
ОТСТУПАТЬ
Раздел FALLBACK ниже указывает , что "offline.html" будет подан на месте всех файлов в / html / каталога, в случае , если подключение к Интернету не может быть установлено:
FALLBACK:
/html/ /offline.html
Примечание: первый URI является ресурс, то второй является резервным.
Обновление кэша
После того, как приложение кэшируется, она остается в кэше, пока один из следующих не происходит:
- Пользователь очищает кэш браузера
- Файл манифеста изменен (see tip below)
- Кэш приложений программно обновлен
Пример - Полный кэш манифест файл
CACHE MANIFEST
# 2012-02-21 v1.0.0
/theme.css
/logo.gif
/main.js
NETWORK:
login.asp
FALLBACK:
/html/ /offline.html
Tip: Строки , начинающиеся с "#" являются строками комментариев, но могут также служить еще одной цели. Кэш приложения обновляется только при изменении файла манифеста. При редактировании изображения или изменить функцию JavaScript, эти изменения не будут повторно кэшируются. Обновление даты и версии в строке комментария является одним из способов сделать браузер повторно кэширует файлы.
Замечания по кэшу приложений
Будьте осторожны с тем, что вы кэшировать.
После того, как файл в кэше, браузер будет продолжать показывать кэшированные версии, даже если вы измените файл на сервере. Чтобы браузер обновляет кэш, вам необходимо изменить файл манифеста.
Примечание: браузеры могут иметь различные ограничения на размер кэшированных данных (some browsers have a 5MB limit per site) для (some browsers have a 5MB limit per site) .