Service worker 工作箱升温缓存问题

我在应用程序中缓存了api。我想在服务人员安装时缓存api。我在缓存中发现：

import {cacheNames} from 'workbox-core';

self.addEventListener('install', (event) => {
  const urls = [/* ... */];
  const cacheName = cacheNames.runtime;
  event.waitUntil(caches.open(cacheName).then((cache) => cache.addAll(urls)));
});

如果使用配置了自定义缓存名称的策略，则可以执行相同的操作；只需将自定义值指定给cacheName即可

1） 我正在使用自定义缓存名称。我会对多个缓存名称使用数组吗？ie

constcachename=['fooapi'，'bar'api']

2） 我使用的url是regexp

/foo/

。这些rexexp URL在这里工作吗

---

3） 在浏览器使用api之前，当服务人员正在安装api时，我是否能够缓存api？

您可以在

安装

处理程序中向任意数量的缓存添加任意数量的项目

Workbox可以使用

RegExp

s将传入的

fetch

请求路由到适当的响应处理程序，我假设这就是您在这里所指的。答案是否定的，你不能只提供一个

RegExp

，如果你想提前缓存URL，你需要提供一个完整的URL列表

在

安装

处理程序中执行的任何缓存都保证在服务工作者激活之前发生，因此在

获取

处理程序开始拦截请求之前发生。是的，这是一种确保缓存预填充的方法

对代码的修改可能如下所示：

self.addEventListener('install', (event) => {
  const cacheURLs = async () => {
    const cache1 = await caches.open('my-first-cache');
    await cache1.addAll([
      '/url1',
      '/url2',
    ]);

    const cache2 = await caches.open('my-second-cache');
    await cache2.addAll([
      '/url3',
      '/url4',
    ]);
  };

  event.waitUntil(cacheURLs());
});

---

如果URL是带有动态参数的RESTful API，并且我需要regexp怎么办？像

/customer/1/item/5

？这不是预先缓存东西的方式。您需要提供URL列表。这样想一下，如果您不提供

RegExp

应该匹配的URL的来源是什么？