简体   繁体   English

chrome扩展中传递的消息不起作用

[英]Message passing in chrome extension not working

I'm new to chrome extensions and I'm having a bit of trouble getting started. 我是chrome扩展程序的新手,上手时遇到了一些麻烦。

First of all my overall goal is to be able to click a button in my popup and have something in the DOM change. 首先,我的总体目标是能够在弹出窗口中单击一个按钮,并在DOM更改中进行一些更改。 If I understand correctly, the way to do this is to load a content script and send this content script a message. 如果我理解正确,执行此操作的方法是加载内容脚本并向该内容脚本发送消息。 This is what I have from looking at the Chrome developers page, but I don't see anything in the console log: 这是我在Chrome开发者页面上看到的内容,但是在控制台日志中什么都没有看到:

manifest.json 的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 popup.html

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

popup.js 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 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"});
    });

A lot of this code is directly from the docs, so I have no idea what I'm doing wrong. 这些代码很多直接来自文档,所以我不知道我做错了什么。

I just copied your code onto my machine and ran it as-is and it works as you expect. 我只是将您的代码复制到我的计算机上,并按原样运行,它可以按您的期望工作。 I think you may be confused about where the console.log output you're expecting will appear, though. 我想您可能对您期望的console.log输出出现在何处感到困惑。

Open any web page and open the console for that page. 打开任何网页,然后打开该页面的控制台。 Click your browser action, the popup shows up, and sure enough the line from a content script:chrome-extension://fndmlopghajebfadeabnfnfmhalelokm/popup.html appears. 单击浏览器操作,将显示弹出窗口,并确保足够显示from a content script:chrome-extension://fndmlopghajebfadeabnfnfmhalelokm/popup.html的行from a content script:chrome-extension://fndmlopghajebfadeabnfnfmhalelokm/popup.html

You don't see your goodbye line appear there, though – because that's being logged out from popup.js , not the tab's content script. 不过,您看不到您的goodbye行-因为该行是从popup.js而不是该选项卡的内容脚本中注销的。 Let's open an inspector for the popup and look for the goodbye message there. 让我们打开弹出窗口的检查器,然后在其中查找goodbye消息。 Right-click the browser action icon and select the "Inspect popup" menu item. 右键单击浏览器操作图标,然后选择“检查弹出窗口”菜单项。 Your (empty) popup shows, and a new inspector window appears; 显示(空)弹出窗口,并出现一个新的检查器窗口。 select the Console tab and you'll see the goodbye message there. 选择控制台选项卡,您将在此看到goodbye消息。

For additional info, see the Chrome Extension Debugging tutorial . 有关其他信息,请参见Chrome扩展调试教程

PS. PS。 chrome.tabs.getSelected is deprecated; chrome.tabs.getSelected已弃用; you should use chrome.tabs.query instead. 您应该改用chrome.tabs.query And I agree with 方 觉 – you ought to consider using programmatic injection to make your DOM changes instead. 我同意方觉–您应该考虑使用程序化注入来更改DOM。

The popup.js script will launch the file when you load the popup.html (DOMContentLoaded). 当您加载popup.html(DOMContentLoaded)时,popup.js脚本将启动文件。 But surely, the content will be injected script is not yet in any web page, since you have not had time to not had time to open it and that "matches": ["http:// * / *"], is ok. 但可以肯定的是,由于您没有时间没有时间打开内容并且“匹配”:[“ http:// * / *”]可以,因此该内容将在任何网页上都不会被注入脚本。 Changes the background content script by background script and I think it will work. 通过后台脚本更改后台内容脚本,我认为它将起作用。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM