Javascript 来自消息事件的Workbox缓存URL

我尝试使用消息事件在缓存中添加一些

路由

在每一页上，都有一些关于动态的内容，我想保存在缓存中。为此，我在加载文档时向我的服务人员发送一个URL数组：

window.addEventListener('load', () => {
  if (serviceWorker.isServiceWorkerSupported()) {
    serviceWorker.register();

   if (typeof PRECACHE_ROUTES !== 'undefined') {
      serviceWorker.sendPreCacheRoutesToSW(PRECACHE_ROUTES);
    }
  }
});

但是，使用此方法，如果用户没有网络，则
StaleWhileRevalidate
同样不起作用，您可以看到一个示例：

registerRoute(
  '/',
  new StaleWhileRevalidate({
    cacheName: 'routes', // Work on offline
    plugins,
  }),
);

self.addEventListener('message', event => {
  if (event.data && event.data.type === 'PRECACHE_ROUTES') {
    event.data.routes.forEach(route => {
      registerRoute(
        route,
        new StaleWhileRevalidate({
          cacheName: 'routes', // Not work on offline
        }),
      );
    });

    event.waitUntil(
      caches.open('routes').then(cache => cache.addAll(event.data.routes)),
    );
  }
});

所有的URL都被很好地缓存，但离线时似乎没有被考虑在内

有人能帮我吗？
我建议使用
工作箱窗口和
工作箱布线来完成以下操作：

//从网页中，使用workbox窗口：
const wb=new Workbox（'/sw.js'）；
wb.addEventListener（'已激活'，（事件）=>{
//获取当前页面URL+页面加载的所有资源。
//根据需要替换为从别处获得的URL列表。
常量urlsToCache=[
location.href，
…performance.getEntriesByType（'resource'）.map（（r）=>r.name），
];
//将URL列表发送到service worker中的路由器。
wb.messageSW({
键入：“缓存URL”，
有效负载：{urlsToCache}，
});
});
//在添加事件侦听器后注册服务工作程序。
寄存器（）；

这将自动将service worker中定义的路由应用于您在
有效负载中提供的URL

在
消息中动态设置这些URL的路由不会给你带来你想要的行为，正如你所发现的那样。
你好，杰夫！谢谢你的网址和提示。但是，在服务人员方面，我并不真正理解如何将URL保存在缓存中？在
工作盒路由中有代码自动应用通过
缓存URL发送的与传入URL匹配的路由