Chrome扩展popup.js向content.js发消息报错：接收端不存在

核心原因：文件名不匹配 #

你在manifest.json的content_scripts里配置的脚本文件名是contentScript.js，但实际你的内容脚本文件名叫content.js——Chrome找不到指定的脚本文件，导致内容脚本根本没注入到页面里，自然没有监听消息的接收端，发送消息时就会触发这个错误。

修复步骤 #

1. 修正manifest.json的文件名配置
   把content_scripts中js数组里的文件名改成和实际一致的content.js，同时可以移除不必要的冗余配置：

修改后的manifest.json：

{
  "name": "First Chrome Extension",
  "description": "Build an Extension!",
  "version": "0.01",
  "permissions": [
    "activeTab",
    "tabs"
  ],
  "action": {
    "default_title": "Scraper",
    "default_popup": "popup.html"
  },
  "content_scripts": [
    {
      "matches": [
        "<all_urls>"
      ],
      "js": [
        "content.js"
      ],
      "run_at": "document_end"
    }
  ],
  "manifest_version": 3
}

2. 重新加载扩展并刷新页面
   修改代码后，在Chrome扩展管理页点击「重新加载」，务必刷新当前网页——只有刷新页面，修改后的内容脚本才会重新注入到页面中。

3. （可选）增加错误处理方便排查
   可以在chrome.tabs.sendMessage的回调里加上错误处理，快速定位问题：

chrome.tabs.sendMessage(tabs[0].id, {message:"run"}, function(response) {
    if (chrome.runtime.lastError) {
        console.error(chrome.runtime.lastError.message);
    } else {
        console.log("Hello");
    }
});

额外说明 #

• 当前功能不需要background.js，用popup和content script完全能实现。
• externally_connectable是用来让外部网站和扩展通信的，你现在的场景用不到，可以删掉。
• background权限对应manifest v3的service_worker，没用到的话也可以移除。

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