如何解决使用chrome.windows.create新建标签页后无法向内容脚本发消息的问题

问题根因及修复方案 #

你遇到的问题由两个核心错误导致，按优先级修复即可：

1. 窗口返回参数取值错误

chrome.windows.create的回调参数win对象不存在tabId属性，当前窗口关联的标签页存放在win.tabs数组里，你当前只塞了一个标签，所以取win.tabs[0].id才是正确的标签ID，你之前发消息的目标ID是undefined，自然收不到。

2. 消息发送时机过早

你刚创建完窗口就立刻发消息，此时目标页面还在加载中，内容脚本还没注入、监听事件还没注册，消息直接发送失败。需要等待页面加载完成后再发消息。

3. 额外配置校验

先确认你的manifest.json里内容脚本配置正确，示例如下：

{
  "manifest_version": 3,
  "name": "测试扩展",
  "version": "1.0",
  "background": {
    "service_worker": "background.js"
  },
  "content_scripts": [
    {
      "matches": ["https://vnexpress.net/*"],
      "js": ["content_script.js"]
    }
  ],
  "permissions": ["tabs"]
}

如果是Manifest V2版本，对应调整配置字段即可，核心是matches规则要匹配目标域名。

修复后的background.js代码 #

chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
    if (request.action == "run") {
        chrome.tabs.create({
            url: 'https://vnexpress.net/',
            active: false
        }, function (tab) {
            chrome.windows.create({
                tabId: tab.id,
                type: 'popup',
                focused: true
            }, function (win) {
                const targetTabId = win.tabs[0].id;
                // 监听页面加载完成再发消息
                const onTabUpdated = (tabId, changeInfo, tab) => {
                    if (tabId === targetTabId && changeInfo.status === 'complete') {
                        chrome.tabs.sendMessage(targetTabId, { action: "scrape" });
                        // 移除监听避免重复触发
                        chrome.tabs.onUpdated.removeListener(onTabUpdated);
                    }
                };
                chrome.tabs.onUpdated.addListener(onTabUpdated);
            });
        });
    }
    sendResponse();
})

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