javascript - 将消息从弹出窗口发送到内容脚本？

Question

假设我想在单击 google chrome 扩展的弹出页面中的按钮时运行内容脚本？

我尝试了以下方法：

//popup.js
document.addEventListener('DOMContentLoaded', function () {
  document.querySelector('button').addEventListener('click', clicked);
  main();
});

function clicked(){
    chrome.tabs.getCurrent(
        function(tab){
            console.log(tab);
            chrome.tabs.sendMessage(tab.id, "doSomething");     
        }
    ); 
}

在内容脚本中：

chrome.extension.onMessage.addListener(
    function(message, sender, sendResponse){
        console.log("hello world");
    }
);

问题是tab回调chrome.tabs.getCurrent( )中的未定义。

Answer 1

您是否授予了 manifest.json 中选项卡的权限，如此处所示。

 "permissions": [
    "tabs"
  ],

此外，以下代码返回的 tab.id 是弹出视图（不是内容脚本 TAB.ID）

chrome.tabs.getCurrent(
        function(tab){
            console.log(tab);
            chrome.tabs.sendMessage(tab.id, "doSomething");     
        }
    ); 

如果您想向您正在浏览的选项卡发送消息，请使用以下代码的 tab.id，它会给出正确的结果

chrome.tabs.query({"status":"complete","windowId":chrome.windows.WINDOW_ID_CURRENT,"active":true}, function(tabs){
     console.log(JSON.stringify(tabs[0]));
     console.log(tabs[0].id); 
});

如果您需要更多信息，请与我们联系

Answer 2

@Sudarshan 提供的答案是有效的并且工作正常，但我刚刚找到了另一个解决我的问题的方法。只是想我把它放在这里：

function clicked() {
    chrome.tabs.executeScript(null,
      {code:"console.log('hello world');"});
}

它将注入并执行脚本。