消息传递在chrome扩展不工作

Message passing in chrome extension not working

本文关键字：工作 扩展 chrome 消息传递      更新时间：2023-09-26

我是chrome扩展的新手，我在开始时遇到了一点麻烦。

首先，我的总体目标是能够在我的弹出框中单击一个按钮，并在DOM中有一些变化。如果我理解正确的话，这样做的方法是加载内容脚本并向该内容脚本发送消息。这是我从Chrome开发者页面看到的，但我在控制台日志中没有看到任何东西:

manifest.json 

{
    "manifest_version": 2,
    "name": "Test",
    "version": "1.0",
    "permissions": [
        "tabs", "http://*/*"
    ],
    "content_scripts": [
        {
            "matches": ["http://*/*"],
            "js": ["content.js"]
        }
    ],
    "browser_action": {
        "default_icon": "icon.png",
        "default_popup": "popup.html"
    }
}

popup.html 

<html>
  <body>
    <script src="popup.js"></script>
  </body>
</html>

popup.js 

document.addEventListener('DOMContentLoaded', function () {
    chrome.tabs.getSelected(null, function(tab) {
        chrome.tabs.sendMessage(tab.id, {greeting: "hello"}, function(response) {
            console.log(response.farewell);
        });
    });
});

content.js 

chrome.runtime.onMessage.addListener(
    function(request, sender, sendResponse) {
        console.log(sender.tab ?
                    "from a content script:" + sender.tab.url :
                    "from the extension");
        if (request.greeting == "hello")
            sendResponse({farewell: "goodbye"});
    });

很多代码直接来自文档，所以我不知道我做错了什么

我只是将您的代码复制到我的机器上并按原样运行它，它可以像您期望的那样工作。我想你可能会对感到困惑，但是您期望的console.log输出将出现。

打开任何网页并打开该页的控制台。点击你的浏览器操作，弹出窗口显示出来，果然出现了from a content script:chrome-extension://fndmlopghajebfadeabnfnfmhalelokm/popup.html行。

你没有看到你的goodbye线出现在那里，虽然-因为这是从popup.js被注销，而不是标签的内容脚本。让我们打开一个检查器，在那里寻找goodbye消息。右键单击浏览器操作图标并选择"Inspect弹出"菜单项。您的(空)弹出显示，并出现一个新的检查器窗口;选择Console选项卡，您将在那里看到goodbye消息。

更多信息，请参见Chrome扩展调试教程。

p。 chrome.tabs.getSelected已弃用;你应该使用chrome.tabs.query。而且我同意这样的观点——您应该考虑使用编程注入来更改DOM。

popup.js脚本将在加载popup.html (DOMContentLoaded)时启动该文件。但可以肯定的是，将被注入的内容脚本还没有在任何网页中，因为您还没有时间去打开它，而那"matches":["http://*/*"]，是可以的。改变背景内容脚本的背景脚本，我认为它会工作。

相关文章：