如何使用 forge.file.cacheURL 正确缓存许多图像（循环中）？答案

【问题标题】：How to cache many images(in loop) properly using forge.file.cacheURL?如何使用 forge.file.cacheURL 正确缓存许多图像（循环中）？
【发布时间】：2013-01-25 23:57:37
【问题描述】：

我有一个从服务器下载为 json 文件的产品列表。每个项目都包含一个指向存储在服务器上的图像的链接。

现在我希望能够在离线时看到产品，所以我将下载的 json 文件存储到 forge.prefs http://docs.trigger.io/en/v1.3/modules/prefs.html 并将其拉出以在屏幕上显示项目。它工作得很好，但我还需要在本地存储图像才能正确显示。

为了实现这一点，我正在尝试使用 forge.file.cacheURL http://docs.trigger.io/en/v1.3/features/cache.html 但无法处理正确的操作顺序。为了缓存图像，我运行 json 文件，并为每一行调用 forge.file.cacheURL 并将 url 存储回 JSON 项。但这是 forge.file.cacheURL 异步运行的问题，所以我的循环在项目上运行并收集本地图像完成，我的代码继续显示图像（查看项目）但同时 forge.file.cacheURL 仍然收集并缓存图像，因为它的异步操作。我需要以某种方式检测最后一项正在被缓存，然后刷新屏幕上的视图以使用正确的图像 url ...或其他会导致我需要的东西。

希望您理解这个概念。我应该如何正确处理？

【问题讨论】：

你能分享一个代码sn-p来演示这个问题吗？不太确定我是否跟随！
答案可能涉及很长的答案。图像有些缓存在“浏览器”中。你在使用backbone.js吗？
我知道浏览器缓存了图片，如果系统从内存中删除您的应用程序并删除整个浏览器缓存，则会出现问题。 forge.pref 可以在这个伟大的事物中幸存下来......

标签： trigger.io forge

【解决方案1】：

从 v1.4.26 开始，您已经能够永久存储图像（请参阅 http://docs.trigger.io/en/v1.4/release-notes.html#v1-4-26），而不仅仅是缓存它们。根据您的需要，这可能是比forge.file.cacheURL 和forge.file.isFile 更好的选择。

我并没有完全按照你描述的情况，但是这样的事情会让你在做某事之前等待几个异步的事情完成：

// e.g.
var jsonCache = {
    one: "http://example.com/one.jpg",
    two: "http://example.com/two.jpg",
    three: "http://example.com/three.jpg"
};

var cacheCount = 0;
for (var name in jsonCache) {
    if (jsonCache.hasOwnProperty(name)) {
        var imageURL = jsonCache[name];
        cacheCount += 1;
        forge.file.cacheURL(imageURL, function (file) {
            forge.prefs.set(name, file, function () {
                cacheCount -= 1; // race condition, but should be fine (!)
                if (cacheCount <= 0) {
                    alert('all cached');
                }
            });
        });
    }
}

【讨论】：