我知道这是一个非常常见的问题,而且我已经阅读过很多文档和类似情况的答案,但我仍然无法让它发挥作用。所以我很抱歉,但我的问题是如何让内容脚本从popupjs获取消息。
工作流程是:当用户点击扩展图标时,它应显示带有一些选项的弹出窗口。用户点击选项,扩展程序根据点击的选项制作一些内容。
我试过以下:
manifest.js
{
"name": "MyName",
"version": "1",
"description": "My chrome extension",
"browser_action": {
"default_popup": "popup.html"
},
"content_scripts": [{
"matches": ["http://*/*", "https://*/*"],
"css": [
"style.css"
],
"js": [
"bower_components/jquery/dist/jquery.js",
"bower_components/bootstrap/dist/js/bootstrap.js",
"content.js"
]
}],
"permissions": [
"activeTab",
"http://127.0.0.1:8000/"
],
"manifest_version": 2
}
popup.html
<!doctype html>
<html>
<head>
<title>My Extension</title>
<script src="popup.js"></script>
</head>
<body>
<ul>
<li id="push" class="option">Push</li>
<li>Actions
<ul>
<li id="dashboard" class="option">Dashboard</li>
<li id="list" class="option">Your Lists</li>
<li id="settings" class="option">Settings</li>
</ul>
</li>
</ul>
</body>
</html>
popup.js
function click(e) {
chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
console.log('message sent');
chrome.tabs.sendMessage(tabs[0].id, {text:"getStuff", action: e.target.id});
});
window.close();
}
document.addEventListener('DOMContentLoaded', function () {
var options = document.querySelectorAll('.option');
for (var i = 0; i < options.length; i++) {
options[i].addEventListener('click', click);
}
});
content.js
chrome.runtime.onMessage.addListener(
function(request, sender, sendResponse) {
if (request.text == "getStuff") {
console.log('test sent');
}
});
所以我看不到任何控制台日志(它应该显示在页面的常用控制台中吗?),我放在chrome.runtime.onMessage.addListener中的任何代码都不起作用。< / p>
我不太明白为什么它不起作用。我还尝试使用后台脚本来监听来自popup.js的消息,然后将消息从后台脚本传递给content.js,它也不起作用