服务工作者和CSP配置更改

Question

在我们的项目中,我们已经配置并传入了CSP Response Headers.此外,我们有简单的Service Worker,它检查是否可以导航到另一个页面,如果没有重定向到缓存的离线html页面.这是fetch事件的Service Worker的一部分代码

self.addEventListener('fetch', function (event) {
  event.respondWith(
    // Try to find requested resource in the cache
    caches
      .match(event.request).then(function (response) {
        // Fallback to network if it's not in cache
        return response || fetch(event.request);
      })
      .catch(getFallbackResponse(event))
    );
});

但是,当CSP配置发生变化并且在CSP配置中发生此更改之前安装了Service Worker时,我们会收到 Refused to load the script '[url]' because it violates the following Content Security Policy directive: ...错误.一旦我们更新或取消注册Service Worker,就会应用新的CSP配置.

这是预期的行为吗？

Answer 1

如果您查看 MDN 的描述，似乎您需要 Service Worker 立即更新skip\xe2\x80\x8bWaiting()：

\n\n

\n

强制等待的 Service Worker 变成活跃的 Service Worker。

\n\n

使用此方法Clients.claim()可确保对底层 Service Worker 的更新对当前客户端和所有其他活动客户端立即生效。

\n

\n\n

Clients.claim()是为了确保其他可能打开的选项卡中的 Service Worker 也得到更新。

\n