Service Worker 进入缩减阶段，因为预缓存文件被 Ad Blocker（chrome 扩展名）阻止。

Question

所有逻辑都失败了，因为 chrome 扩展阻止了我的一个 js 文件，有没有办法让预缓存更健壮？即使我在缓存某些文件时出错，我仍然可以正确缓存大部分文件，并且我有运行时间缓存。

Answer 1

如果您正在使用 workbox-precaching，那么答案是否定的 — 它的设计是为了让服务工作者安装仅在预缓存清单中的所有项目都成功添加到缓存中时才会继续。这样，您就可以保证拥有一组可离线使用的实用资源。（a longstanding feature request 用于添加对“可选”预缓存的支持，但尚不清楚这在实践中如何运作。）

我建议对可选的 URL 使用运行时缓存，这些 URL 可能会被浏览器扩展阻止。如果您想在这种情况下“预热”缓存，并且不关心缓存填充是否失败，您可以按照以下行添加自己的逻辑：

import {CacheFirst} from 'workbox-strategies';
import {registerRoute} from 'workbox-routing';
import {precacheAndRoute} from 'workbox-precaching';

const OPTIONAL_CACHE_NAME = 'optional-resources';
const OPTIONAL_URLS = [
  // Add URLs here that might be blocked.
];

self.addEventListener('install', (event) => {
  event.waitUntil((async () => {
    const cache = await caches.open(RUNTIME_CACHE_NAME);
    for (const url of OPTIONAL_URLS) {
      try {
        await cache.add(url);
      } catch (e) {
        // Ignore failures due to, e.g., a content blocker.
      }
    }
  })());
});

// Precache everything in the manifest, which you need to
// configure to exclude your "optional" URLs.
precacheAndRoute(self.__WB_MANIFEST);

// Use a cache-first runtime strategy.
registerRoute(
  // Check url.pathname, or url.href, if OPTIONAL_URLS
  // contains full URLs.
  ({url}) => OPTIONAL_URLS.includes(url.pathname),
  new CacheFirst({cacheName: OPTIONAL_CACHE_NAME}),
);

Service Worker 进入缩减阶段，因为预缓存文件被 Ad Blocker（chrome 扩展名）阻止。

Service worker goes to redudent phase because pre-caching files are blocked by Ad Blocker(a chrome extension.)

service-worker

progressive-web-apps

workbox