Service Worker 列出缓存中的所有 url 并传递给另一个函数

aga*_*ggi 4 javascript browser-cache service-worker workbox

我在我的项目中使用工作箱,但问题不是工作箱特有的。

谁能告诉我如何从特定缓存中检索所有网址的列表并将其返回给回调函数。我正在尝试向用户显示所有缓存网址的列表以及删除它们的选项。但我无法填充/显示所有缓存网址的列表。

我正在做的是:

function queryCache(){
    var url = [];
    caches.open('mycache').then(function (cache){
        cache.keys().then(function(keys){
            return new Promise(function(resolve, reject) {
                keys.forEach(function (request, index, array) {
                    cache.match(request).then(function (response){
                        url.push(response.url);
                    })
                })
                resolve();
            });
        }).then(function(){
            console.log(url); // lists all urls in console as array
            cacheList(url);
        });
    })
}

function cacheList(Items)
{   for(var i = 0; i < Items.length; i++){
        console.log('Items: '+Items[i]); //never reaches
    }
    console.log(Items.length); // always show 0
}
Run Code Online (Sandbox Code Playgroud)

当我从控制台调用queryCache()时,正确调用了cacheList(Items),但问题是,Items始终是一个空数组,并且其长度始终为0。

可能我没有正确使用 Promise 解析。请帮忙谢谢

aga*_*ggi 5

我传递了错误的承诺,以下是工作代码,

在 stackoverflow 或网络上没有这样的问题来列出某些缓存的所有 url 并传递给函数,我希望它会对某人有所帮助。

function queryCache(){
    var url = [];
    caches.open('mycache').then(function (cache){
        cache.keys().then(function(keys){
            return Promise.all(
                    keys.map(function(k){url.push(k.url); return k.url} )
                )
        }).then(function(u){ cacheList(url);})
    })
}

function cacheList(Items)
{   for(var i = 0; i < Items.length; i++){
        console.log('Items: '+Items[i]);
    }
}
Run Code Online (Sandbox Code Playgroud)