Question

在服务工作者的帮助下，如果没有与服务器的连接，我想从缓存返回响应。然后，如果缓存中没有正确的响应，我想要返回自定义响应。

目前，我有这段代码：

this.addEventListener('fetch', function (event) {
    event.respondWith(
        timeout(5000, fetch(event.request)).catch(function() {
            return caches.match(event.request);
        })
    );
});

我希望有这样的东西：

this.addEventListener('fetch', function (event) {
    event.respondWith(
        timeout(5000, fetch(event.request)).catch(function() {
            caches.match(event.request).then(function(cacheResponse) {
                return cacheResponse;
            }).catch(function () {
                return new Response('No cache found');
            })
        })
    );
});

甚至更好

this.addEventListener('fetch', function (event) {
    event.respondWith(
        timeout(5000, fetch(event.request)).catch(function() {
            caches.match(event.request).then(function(cacheResponse) {
                return cacheResponse;
            }).catch(function () {
                return caches.match(offlineMessageUrl);
            })
        })
    );
});

但它不起作用。

Answer 1

从Cache.match函数的文档中，承诺始终得到解决。如果找不到匹配项，则使用Response对象解析或使用undefined解析。你可以试试这个： -

    this.addEventListener('fetch', function (event) {
        event.respondWith(
            caches.match(event.request).then(function(cacheResponse) {
                return cacheResponse || new Response('No cache found');
            }).catch(function () {
                return new Response('No cache found');
            })
        );
    });

当没有与服务器

1 个答案: