使用jquery缓存indexeddb中的图片供离线使用答案

【问题标题】：Use jquery to cache images in indexeddb for offline use使用jquery缓存indexeddb中的图片供离线使用
【发布时间】：2012-01-16 18:06:39
【问题描述】：

我有一个图片较多的网页，需要在移动设备上离线查看。

我发现 jquery plugin/tutorial 确实将图像存储在本地存储中，但这不适用于我的目的。

这是可以很容易地改用 indexeddb 的东西吗？

另外，我的图片会定期更新。有没有办法可以在一定时间后自动清除缓存的版本，并强制用户从网络重新加载？

【问题讨论】：

【解决方案1】：

索引数据库 您可以将图像存储到 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. 更新更容易，你只需将新图像放到网络服务器上，然后更新清单文件中的版本号。

您可以阅读有关Offline spec 的更多信息，或者只需在 Google 上搜索示例。

【讨论】：

我不只是使用应用程序缓存的原因是大小限制。会有很多图片，超过5mb的限制。有人告诉我 android 支持 Indexeddb。有没有其他选择，没有应用缓存的大小限制？
我不相信，似乎所有的浏览器都锁定在 5MB。我认为您会遇到与 IndexedDB 类似的问题。我相信这些在某些浏览器上是大小锁定的。