Question

我想拥有一个数组来配置路径的一部分（当响应与所请求的URL匹配时缓存响应）和过期时间（在X秒后使缓存过期），但是我无法使用'handler才能正常工作。

这是用于配置路径和到期时间的数组：

const PATHS_TO_CACHE = [
    { url: 'api/v1/destination', expiration: THIRTY_DAYS },
    { url: 'api/v1/hotel', expiration: THIRTY_MINUTES },
];

这是一种缓存方法，它调用cachePath进行匹配，并调用pathHandler进行处理：

function cachePaths() {
    workbox.routing.registerRoute(cachePath, pathHandler);
}

match方法：

function cachePath({ url, event }) {
    const match = PATHS_TO_CACHE.find(function(path) {
        return url.href.includes(path.url);
    });

    return match || false;
}

处理程序方法：

function pathHandler({ url, event, params }) {
    return workbox.strategies.staleWhileRevalidate({
        cacheName: 'url-cache',
        plugins: [
            new workbox.cacheableResponse.Plugin({
                statuses: [0, 200],
            }),
            new workbox.expiration.Plugin({
                maxAgeSeconds: params.expiration,
            }),
        ],
    });
}

好吧，pathHandler无法正常工作，几次尝试使我感到沮丧……在需要return new Response(something)的地方抛出错误（是在url和event的帮助下）），错误的获取请求和错误的对象响应。

那么，我该如何构建pathHandler方法来将响应缓存X秒钟并仍然获得正确的响应？

谢谢！

Answer 1

您在误用API。

workbox.strategies.staleWhileRevalidate({...}) <- Returns a Route

遗憾的是，此处的文档尚不清楚：https://developers.google.com/web/tools/workbox/reference-docs/latest/workbox.strategies

此处概述了您想做的事情：https://developers.google.com/web/tools/workbox/modules/workbox-strategies#advanced_usage

function pathHandler({ url, event, params }) {
    const staleWhileRevalidate = new workbox.strategies.StaleWhileRevalidate({
        plugins:[...],
    });
    return staleWhileRevalidate.handle({event});
})

工作箱-使用自定义处理程序

1 个答案: