Используйте jquery для кэширования изображений в indexeddb для автономного использования - PullRequest
Новая
       3

Используйте jquery для кэширования изображений в indexeddb для автономного использования

1 голос
/ 16 января 2012

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

Я нашел плагин / учебник jquery для хранения изображений в локальном хранилище, но это не сработает для моих целей.

Может ли это быть легко адаптировано для использования indexeddb вместо этого?

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

1 Ответ

1 голос
/ 27 января 2012

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

Также, если вам это нужно для работы на мобильных устройствахУстройства, IndexedDB - это не то, что вам нужно, поскольку ни один из текущих мобильных браузеров не поддерживает IndexedDB.(Источник: http://caniuse.com/#feat=indexeddb)

Автономные приложения Я бы рекомендовал вместо этого использовать новую функцию HTML5 под названием «Кэш приложений». Это поддерживается практически всеми браузерами (Источник: http://caniuse.com/#feat=offline-apps)

Чтобы использовать его, вам просто нужно создать файл Website.manifest, такой как: 

CACHE MANIFEST
# v0.0.3 2011-12-21
images/ImageThatIWantToCache.png
images/SecondImage.png

Затем на вашей веб-странице измените html-тег на что-то вроде: 

<html manifest="Website.manifest">

Преимущества: 1. Браузер автоматически кеширует изображения. 2. Вы получаете доступ к изображениям, используя исходный URL-адрес (т.е. /images/SecondImage.png). 3. Обновление выполняется намного проще, просто перетащите новые изображения навеб-сервер и обновите номер версии в файле манифеста.

Вы можете узнать больше о Автономной спецификации или просто выполнить поиск в Google по примерам.

...