Javascript 什么会导致此处出现“InvalidStateError”的承诺被拒绝？

什么会导致此处出现“InvalidStateError”的承诺被拒绝

在Firefox版本52上发生以下错误：Service worker事件waitUntil传递了一个承诺，该承诺被拒绝，并带有“InvalidStateError:试图使用不可用或不再可用的对象”。在那之后，服务人员被杀并被带走。它与铬合金配合使用效果很好。ressourcesToSaveInCache是一个相对URL数组

编辑并将其更改为

event.waitUntil(
    fillServiceWorkerCache()
    .then(skipWaiting)
    .catch(skipWaiting)
);

服务人员登记！然而fillServiceWorkerCache被拒绝了，这是一个没有离线缓存的大问题。现在的问题是为什么fillServiceWorkerCache拒绝，错误消息试图告诉我们什么

编辑灵感来自Hosar的答案：

const fillServiceWorkerCache2 = function () {
    return caches.open(CACHE_VERSION).then(function (cache) {
        return Promise.all(
            ressourcesToSaveInCache.map(function (url) {
                return cache.add(url).catch(function (reason) {
                    return console.log(url + "failed: " + String(reason));
                })
            })
        );
    });
};

这个版本在返回链中传播一个承诺，使waitUntil实际等待它。对于未能添加到缓存中的单个资源，它不会缓存，也不会拒绝

编辑2：修复ResSourceToSaveInCache中无效的相对URL后，错误消失了

，最可能的原因是img src无效，如前所述。 因此，使用cache.addAll，如果其中一个请求无效，则不会保存任何请求。更好地使用：cache.add，如下所示：

在这种情况下，所有有效的URL都将被保存。

最有可能的是，如前所述，img src无效。 因此，使用cache.addAll，如果其中一个请求无效，则不会保存任何请求。更好地使用：cache.add，如下所示：

在这种情况下，将保存所有有效的URL

const fillServiceWorkerCache2 = function () {
    return caches.open(CACHE_VERSION).then(function (cache) {
        return Promise.all(
            ressourcesToSaveInCache.map(function (url) {
                return cache.add(url).catch(function (reason) {
                    return console.log(url + "failed: " + String(reason));
                })
            })
        );
    });
};

return caches.open('cacheName').then(function(cache) {
      Promise.all(
        ressourcesToSaveInCache.map(function(url){cache.add(url)})
      );
    });