如何在PhoneGap中缓存图像和html文件

Question

我需要一种方法来从我的网站PhoneGap中的缓存图像和html文件.我计划用户将看到没有互联网连接的网站,就像它将使用它一样.但我只看到有关sql数据存储的信息,但我如何存储图像(以后再使用).

Answer 1

要缓存图像,请查看此库 - 我是其创建者 - : imgcache.js .它的设计目的是使用本地文件系统缓存图像.如果您查看示例,您将看到它还可以检测到何时无法加载图像(因为您处于脱机状态或连接非常糟糕),然后使用缓存的图像自动替换它.webapp的用户甚至没有注意到它处于脱机状态.

至于html页面..如果它们是html静态文件,它们可以本地存储在web应用程序中(file:// in phonegap).如果它们是动态生成的页面,请检查localStorage API(如果您有少量数据),否则检查文件系统API.

对于我的Web应用程序,我只从我的服务器检索json数据(并使用Backbone + Underscore 处理/渲染它).json有效负载存储在localStorage中.如果应用程序脱机,它将从localStorage而不是服务器(Backbone.dualStorage的自制分支)获取json数据

然后,您将获得完整的离线体验:页面+图像.

Answer 2

像您可能需要的简单离线操作缓存并不是那么容易.

您的第一个选项是缓存清单.它有一些限制(比如缓存的大小)但可能对你有用,因为它的设计是为了你想要的.

另一个选择是您可以使用文件系统API将内容存储在设备的磁盘上.这有一些缺点,例如安全性,以及您必须从路径/ URL加载文件的事实,该路径/ URL与您通常从Web上加载的路径/ URL不同.查看hydra插件以获取此示例.

最后一个选择可能是将东西存储在localStorage中(它具有在所有平台上都是私有的),然后在需要时将其拉出来......这意味着将所有图像都放入其中,这是一个相当大的启示从标准缓存.