sendMessage从弹出窗口到content.js不能在chrome扩展中工作

tec*_*dog 7 popup sendmessage google-chrome-extension

我正在尝试为chrome扩展程序创建一个弹出界面.我似乎无法从popup.html/popup.js向content.js脚本发送消息.这是我到目前为止所拥有的.当我点击扩展图标时,我会看到一个说clickme的按钮.我点击它没有任何反应,chrome javascript控制台没有错误,也没有发送到content.js的消息.

表现

{
"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'",
  "manifest_version": 2,
  "name": "extensiontest",
  "version": "0.2",
  "content_scripts": [
  {
    "matches": [
      "<all_urls>"
    ],
    "js": ["content.js"]
  }
],
"browser_action": {
  "default_icon": "Beaker.png",
    "default_popup":"popup.html"
},
"background": {
  "scripts": ["background.js"]
},
"permissions": [
    "tabs"
  ]
}
Run Code Online (Sandbox Code Playgroud)

popup.html

<html>
<head></head>
<script src="popup.js"></script>
<body>
<input id="button1" type=button value=clickme>
</body></html>
Run Code Online (Sandbox Code Playgroud)

popup.js

function popup(){
    alert(1);
      chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
    var activeTab = tabs[0];
    chrome.tabs.sendMessage(activeTab.id, {"message": "start"});
  });

button1=document.getElementById("button1");
button1.addEventListener('click', popup)
}
Run Code Online (Sandbox Code Playgroud)

content.js

   chrome.runtime.onMessage.addListener(
      function(request, sender, sendResponse) {
        if( request.message === "start" ) {
         start();
             }
      }
    );

    function start(){
        alert("started");
    }
Run Code Online (Sandbox Code Playgroud)

Day*_*ang 21

我修改了您的用户popup.js并将DOMContentLoadedChrome扩展用作:

popup.js:

 function popup() {
    chrome.tabs.query({currentWindow: true, active: true}, function (tabs){
    var activeTab = tabs[0];
    chrome.tabs.sendMessage(activeTab.id, {"message": "start"});
   });
}

document.addEventListener("DOMContentLoaded", function() {
  document.getElementById("button1").addEventListener("click", popup);
});
Run Code Online (Sandbox Code Playgroud)

content.js:

chrome.runtime.onMessage.addListener(
      function(request, sender, sendResponse) {
        if( request.message === "start" ) {
         start();
             }
      }
    );

    function start(){
        alert("started");
    }
Run Code Online (Sandbox Code Playgroud)

popup.html:

<!DOCTYPE html>
<html>
<head></head>
<script src="popup.js"></script>
<body>
<input id="button1" type=button value=clickme>
</body></html>
Run Code Online (Sandbox Code Playgroud)

我已经测试了我的结果它的工作原理.

  • 嗨@gui47 我知道你在 2015 年发表了那篇文章,但我想知道从那以后 chrome 扩展 api 或策略是否有任何重大变化,因为我尝试了你的确切代码,但我没有收到任何错误,但内容脚本没有似乎没有执行 onMessage。 (3认同)
  • 在“Chrome 94.0.4606.81”上测试,运行良好。关键是重新加载扩展**和**正在使用的页面。 (2认同)