如何使用PhoneGap / Cordova在本地缓存图像文件？ [英] How can I cache image files locally with PhoneGap / Cordova?

问题描述

这里是我的问题：

我使用AngularJS和Cordova制作了一个Web / Mobile应用程序。对于离线用途，我使用localStorage来存储应用程序的所有数据（JSON，参数等）。

I making a Web/Mobile app, using AngularJS and Cordova. For offline purpose, I use localStorage to store all the data of the app (JSON, parameters, and so on).

事情是：我需要存储/缓存图像本地（再次，离线目的）。 由于localStorage大小限制大约为5mo，我无法使用它，我需要更多

The thing is : I need to store / cache images locally (again, offline purpose). As localStorage size limit is around 5mo, I can't use it, I need more.

我以为可以使用缓存清单，但它不工作，因为我需要更新它的规则，无需重新编译应用程序（我想我可以把缓存清单在外部服务器，但它就像我不能使用来自另一个域的缓存清单）。

I thought I could use a cache manifest, but it doesn't work, as I need to update it regulary, without recompiling the app (I thought I could put the cache manifest on an external server, but it's like I can't use a cache manifest from another domain).

所以我想使用Cordova / Phonegap File API，但我不知道要实现 ...

So I'm thinking of using Cordova/Phonegap File API, but I have no idea to achieve that...

任何帮助或想法？

推荐答案

经过长时间搜索SO和Github，找到 imgCache.js ，这是一个处理Chrome，Android和iOS（通过Cordova）文件缓存的JS库。

After long hours searching on SO and Github, I found imgCache.js, a JS library that handle file cache for Chrome, Android and iOs (through Cordova).

https://github.com/chrisben/imgcache.js/

然后，基本上：

var target = $('.cached-img');

ImgCache.isCached(target.attr('src'), function(path, success){
          if(success){
            // already cached
            ImgCache.useCachedFile(target);
          } else {
            // not there, need to cache the image
            ImgCache.cacheFile(target.attr('src'), function(){
              ImgCache.useCachedFile(target);
            });
          }
        });

这篇关于如何使用PhoneGap / Cordova在本地缓存图像文件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！