Chrome Extension V3 Service Worker报错：register属性读取失败

核心报错原因 #

Chrome Extension V3 中，background 配置为 Service Worker 后，Chrome 会自动完成该 Service Worker 的注册、启动和生命周期管理，你完全不需要在 background.js 里手动调用 navigator.serviceWorker.register——这是错误操作，也是触发报错的根本原因：

• 在 Service Worker 上下文里，手动注册自身脚本会引发逻辑冲突，甚至导致 navigator.serviceWorker 处于未定义/异常状态，直接抛出 Cannot read properties of undefined (reading 'register')。

移除检查代码后仍报错的可能原因 #

1. 浏览器缓存残留：Chrome 会缓存扩展的旧代码，即使你删除了注册逻辑，缓存的旧 background.js 仍在执行。解决方式：
   • 打开扩展管理页面（chrome://extensions/），找到你的扩展，点击「重新加载」按钮；
   • 勾选「开发者模式」下的「更新时重新加载扩展」，避免后续缓存问题。
2. 隐藏的注册逻辑：检查扩展内其他脚本（如 content script、popup 脚本）是否存在误调用 navigator.serviceWorker.register 的代码，或者 background.js 中是否有间接触发该操作的逻辑。

代码修正建议 #

1. 删除无用的注册代码 #

直接移除这段完全多余的代码：

// 删掉以下全部内容
if ("serviceWorker" in navigator) {
  navigator.serviceWorker.register("background.js")
    .then(function(registration) {
      console.log("Service worker registered:", registration);
    })
    .catch(function(error) {
      console.error("Error registering service worker:", error);
    });
}

2. 修复异步逻辑问题 #

当前代码中，fetch 是异步操作，你在 forEach 循环后直接调用 postMessage，此时 results 还是空数组（所有请求都还没完成）。需要用 Promise.all 等待所有请求结束后再发送结果：

self.addEventListener("message", (event) => {
  var request = event.data;
  if (request.type === "search") {
    var title = request.title;
    var title2 = title.replace(/ /g, "+");
    var queries = [
      `https://www.ncbi.nlm.nih.gov/pmc/?term=${title}`,
      `https://www.biorxiv.org/search/${title}`,
      `https://www.medrxiv.org/search/${title}`,
      `https://www.google.com/search?q=${title2}+filetype:pdf`
    ];

    // 用 Promise.all 等待所有请求完成
    Promise.all(queries.map(query => 
      fetch(query)
        .then(response => response.text())
        .then(html => {
          var $ = cheerio.load(html);
          // 这里写入提取逻辑
          return /* 提取的结果数据 */;
        })
    )).then(results => {
      // 所有请求完成后再发送结果
      event.ports[0].postMessage({ results: results });
    }).catch(err => {
      console.error("请求出错:", err);
      event.ports[0].postMessage({ results: [], error: err.message });
    });
  }
});

3. 确保 cheerio 正确引入 #

如果使用 npm 安装的 cheerio，需要通过打包工具（如 webpack、rollup）将其打包进扩展的 background.js；Service Worker 无法通过 script 标签引入外部脚本，因此不推荐直接引入未打包的 cheerio 文件。

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