我试图做一个简单的扩展。如果有人能帮忙，我会很高兴。sendMessage不能在扩展中使用

目标：当您单击扩展弹出式菜单（popup.html）中的按钮时，当前网页的标题以div（ID为'div1'）显示。

问题：我搜索了互联网做这个，发现传递消息可以用来实现相同。所以我试了一下。但它不工作。我想知道哪里出了问题。

状态：

=扩展被成功导入的铬。

=当单击扩展图标时，会显示正确的弹出窗口。

=当按钮被点击时什么也没有发生。

=开发者控制台显示没有错误。

文件：

=====================================

//manifest.json 
    { 
     "manifest_version": 2, 
     "name": "some_name_extension", 
     "version": "0.0.1", 
     "content_scripts": [ 
     { 
      "matches": [ 
      "<all_urls>" 
      ], 
      "js": ["jquery-3.2.1.js", "content_script.js"] 
     } 
     ], 
     "browser_action": { 
     "default_icon": "icon.png", 
     "default_popup": "popup.html" 
     } 
    }

<!-- popup.html --> 
<! doctype html> 
<html> 
<head> 
    <title> 
    </title> 
    <script type="text/javascript" src="popup.js"> 
    </script> 
    <style> 
     html 
     { 
      height: 200; 
      width: 200; 
     } 
    </style> 
</head> 
<body> 
    <button id="btn1"> 
     click me! 
    </button> 
    <div id="div1"> 
     (title will be displayed here) 
    </div> 
</body> 
</html>

=====================================

//content_script.js 
document.addEventListener('DOMContentLoaded', function() { 
var title1=document.getElementsByTagName("title")[0].innerHTML; 

chrome.extension.onMessage.addListener(

function(msg, sender, sendResponse) { 
    if(sender=="popup") 
    { 
     chrome.extension.sendMessage(title1,"content","1"); 
    } 
    }); 
});

=====================================

//popup.js 
document.addEventListener('DOMContentLoaded', function() { 
    var mainBtn = document.getElementById('btn1'); 
    mainBtn.addEventListener('click', function() { 
     chrome.extension.sendMessage("button_clicked","popup","1"); 
    }); 

    chrome.extension.onMessage.addListener(

    function(msg, sender, sendResponse) { 
     if(sender=="content") 
     { 
      document.getElementById("div1").innerHTML=msg; 
     } 
    } 
    ); 
});

=== ==================================

链接到jQuery脚本文件：https://code.jquery.com/jquery-3.2.1.js

来源

2017-06-02 N_X41

它是'getElementsByTagName'（复数）而不是'getElementByTagName' – Andreas

谢谢@Andreas！我做了更正。但它不能解决我的问题:( –

sender是由浏览器自动设置的对象，不是您可以自己传递的字符串。使用devtools调试器通过在回调中设置断点来检查代码和变量，不要盲目地编写代码。
在这种情况下，不需要检查sender，因为内容脚本无论如何都不能互相发送消息。

从弹出将消息发送到一个内容脚本的正确的方法是chrome.tabs.sendMessage与tabId作为第一个参数：

chrome.tabs.query({active: true, currentWindow: true}, ([tab]) => { 
    chrome.tabs.sendMessage(tab.id, { 
    action: 'setTitle', 
    title: title1, 
    }); 
});

要一次使用一个对象发送许多值：{action: 'setTitle', title: title1}或{action: 'buttonClicked', data: 1}等上。
chrome.extension已经废弃了的消息，使用chrome.runtime
您的代码不使用jQuery，所以没有必要在清单注入它。json

来源

2017-06-02 05:12:50 wOxxOm

非常感谢@wOxxOm！但是我不得不使用响应函数来得到另一端的答案。有没有办法做到这一点？意味着如何接收chrome.tabs.query（{active：true，currentWindow：true}，（[tab]）=> { } ， title：title1， }）; }）; –

@ N_X41什么是“响应函数”？为什么使用它是一个问题？在内容脚本中已经有onMessage监听器了。网页，因为内容脚本在重新加载扩展时不会自动重新注入。 – wOxxOm

这是如何回复回复。（0）.id，{action：'setTitle'， title：title1，}，功能（响应）{ //做出响应 }）; }）; 。有没有问题，只是想知道，你建议什么方法。反正它现在工作正常！感谢您指向正确的方向;） –

sendMessage不能在扩展中使用

=====================================

=== ==================================

回答

相关问题