Chrome 扩展程序打开新选项卡，向新选项卡发送消息

Question

我有一个应用程序页面（extension_id://app.html） 我想创建一个新选项卡:

let tab = await chrome.tabs.create({ url: candidate_url });
chrome.tabs.sendMessage(tab['id'], {"message": "sendMessage", "data": {}, "tabID": tab['id']});

但是，当我向此选项卡 ID 发送消息时，它不起作用。

这里是 content.js 脚本，但它没有警报或控制台日志

chrome.runtime.onMessage.addListener(
    async function(request, sender, sendResponse) {
        if( request.message === "sendMessage"){
            console.log("XX");
            alert("XX");
        }
    }
);

Answer 1

添加 setTimeout 来调用发送函数可以正常工作，只需完美调用页面加载和计时器即可，大约 8 到 10 秒足够页面加载的时间。

蒂亚

Answer 2

遇到了同样的问题，但我按照 @Robbi 上面的方法进行处理（没有超时/睡眠/延迟黑客；））：

const tabLoadingTrap = { tabId: undefined, resolve: undefined };

chrome.tabs.onUpdated.addListener((tabId, changeInfo) => {
  if (tabId === tabLoadingTrap.tabId && changeInfo.status === 'complete') {
    tabLoadingTrap.resolve();

    Object.assign(tabLoadingTrap, { tabId: undefined, resolve: undefined });
  }
});

(async () => {
  const tab = await chrome.tabs.create({ url: 'https://example.com' });
  await waitForTabLoadingToComplete(tab.id);
  const response = await chrome.tabs.sendMessage(tab.id, { greeting: 'hello' });
  console.log(response);
})();

function waitForTabLoadingToComplete(tabId) {
  tabLoadingTrap.tabId = tabId;

  return new Promise((resolve) => {
    tabLoadingTrap.resolve = resolve;
  });
}