如何从服务人员中删除多个打开的缓存答案

【问题标题】：How to delete multiple open cache from service worker如何从服务人员中删除多个打开的缓存
【发布时间】：2019-10-31 18:37:40
【问题描述】：

我一直在做 pwa 项目，我打开了两个缓存一个是静态缓存，另一个是动态缓存，我可以使用此代码一次删除一个缓存

self.addEventListener('activate', event => {
  console.log('Activating new service worker...');

  const cacheWhitelist = [staticCacheName];

  event.waitUntil(
    caches.keys().then(cacheNames => {
      return Promise.all(
        cacheNames.map(cacheName => {
          if (cacheWhitelist.indexOf(cacheName) === -1) {
            return caches.delete(cacheName);
          }
        })
      );
    })
  );
});

我想同时删除两个缓存

【问题讨论】：

标签： javascript caching service-worker progressive-web-apps

【解决方案1】：

您的代码看起来已经不错了。就我而言，我使用以下代码删除 SW 缓存：

if ('caches' in window) {
 caches.keys().then(cacheNames => {
   return Promise.all(
     cacheNames.filter(cacheName => {

      // You can have some custom logic here, if you want
     // to delete only some caches

      // If you return TRUE, the cache will be deleted
      }).map(cacheName => {
       return caches.delete(cacheName);
     })
   );
 })
}

caches.keys() 方法返回 CacheStorage 的键，该接口表示服务工作者可以访问的 Cache 对象的存储。

我写了一篇关于service workers and caching strategies的文章，如果你想加深话题。

【讨论】：

【解决方案2】：

不是专家，但我认为使用这样的过滤器会起作用。

 cacheNames.filter(cacheName => {
          if (cacheWhitelist.indexOf(cacheName) === -1) {
            return caches.delete(cacheName);
          }

【讨论】：

【解决方案3】：

试试这个：

self.addEventListener( "activate", event => {

  event.waitUntil(

    //wholesale purge of previous version caches
    caches.keys().then( cacheNames => {
      cacheNames.forEach( value => {

          caches.delete( value );

      } );

    } );

} );

【讨论】：