Manifest V3下background.js无法向content.js发消息的问题求助

报错原因 #

这个错误本质是当前标签页中没有运行对应的content脚本接收消息，常见触发场景：

• 在Chrome内置页面（如chrome://extensions/、about:blank）或扩展自身页面点击了扩展按钮，这类页面不允许注入content脚本；
• content脚本还未完成注入就发送了消息（比如刚打开页面立刻点击按钮）；
• 扩展未正确加载，导致content脚本没有注入到目标页面。

另外你的代码存在逻辑不匹配问题：background发送的消息是{ message: "browser action" }，但content.js里只处理request.greeting === "hello"的情况，即使连接成功也不会触发响应，但这不是报错的直接原因。

解决步骤 #

1. 选择正确的测试页面 #

不要在Chrome内置页面测试，切换到普通的HTTP/HTTPS页面（比如百度、谷歌首页）再点击扩展按钮。如果需要在file://协议页面测试，要在扩展管理页面开启「允许访问文件网址」。

2. 修改代码适配消息逻辑并添加错误处理 #

更新background.js的消息发送逻辑，使用Promise语法处理错误，同时对齐content.js的消息字段：

chrome.action.onClicked.addListener(buttonClicked);

async function buttonClicked(tab) {
  console.log("button clicked!");
  console.log("sending message");
  try {
    // 发送content.js能识别的消息格式
    const response = await chrome.tabs.sendMessage(tab.id, { greeting: "hello" });
    console.log("收到响应:", response);
  } catch (err) {
    console.error("发送消息失败:", err);
    alert("当前页面无法使用该扩展，请切换到普通网页重试");
  }
}

chrome.runtime.onMessage.addListener(receiver);

function receiver(request, sender, sendResponse) {
  if (request.message === "thank you") {
    // 可添加处理逻辑
  }
}

在content.js开头添加加载日志，确认脚本是否正常注入：

console.log("Content脚本已加载");

chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
  console.log(
    sender.tab
      ? "来自内容脚本:" + sender.tab.url
      : "来自扩展"
  );
  if (request.greeting === "hello") {
    console.log("收到hello消息");
    sendResponse({ farewell: "goodbye" });
  }
});

3. 重新加载扩展 #

修改代码后，打开chrome://extensions/页面，点击扩展卡片上的刷新按钮，确保最新代码生效。

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