Firefox中Service Worker的install事件未触发（Chrome中正常）

你的问题核心是：Service Worker在Chrome中能正常触发install/activate/fetch事件，但Firefox中注册状态显示Running，却没有任何事件日志，也不拦截请求。下面是针对性的排查和解决办法：

1. 先找对Firefox中Service Worker的日志位置 #

Firefox的Service Worker日志不在页面主控制台，需要打开专用调试面板查看：

• 地址栏输入 about:debugging#/runtime/this-firefox
• 在"已安装的Service Worker"列表里找到你的站点对应的SW
• 点击"检查"按钮，打开SW专属的控制台，这里才能看到sw、Installed!这类日志

这是最容易踩的坑，很多人误以为主控制台能看到SW日志，其实Firefox把SW日志隔离到单独的调试窗口了。

2. 修正install/activate事件的异步处理逻辑 #

你的代码里skipWaiting()和clients.claim()都是异步操作，但没有用event.waitUntil()包裹，Firefox对Service Worker生命周期事件的完成时机判断更严格，可能导致事件被判定为未完成，后续逻辑不执行。修改代码如下：

修正后的sw.js： #

console.log("sw");

self.addEventListener("install", (event) => {
  // 用waitUntil确保install完成前等待skipWaiting执行完毕
  event.waitUntil(
    self.skipWaiting().then(() => {
      console.log("Installed!");
    })
  );
});

self.addEventListener("activate", function (event) {
  // 同样用waitUntil包裹clients.claim()
  event.waitUntil(
    clients.claim().then(() => {
      console.log("Activated!");
    })
  );
});

self.addEventListener("fetch", (event) => {
  console.log("fetch");
});

self.addEventListener("push", (event) => {
  console.log("push");
});

3. 清理Firefox中旧的Service Worker缓存 #

有时候旧的SW缓存会干扰新SW的激活，手动清理试试：

• 地址栏输入 about:serviceworkers
• 找到你站点对应的SW，点击"注销"按钮
• 关闭所有相关标签页，重新打开站点加载

4. 显式指定Service Worker作用域 #

虽然注册返回的scope是根路径，但可以显式指定作用域确保Firefox识别正确：

navigator.serviceWorker.register("/sw.js", { scope: "/" })

按上面的步骤排查，优先检查日志位置，再修正代码逻辑，应该能解决Firefox中不触发事件的问题。

内容的提问来源于stack exchange，提问作者user18810548