如何通过上下文菜单将消息从Chrome扩展程序后台脚本传递到JavaScript中的内容脚本?

时间:2017-08-01 14:45:20

标签: javascript google-chrome google-chrome-extension message-passing

我正在使用JavaScript进行Chrome扩展,并且需要能够使用上下文菜单中的自定义条目将消息从后台脚本传递到内容脚本,作为此触发器。

manuscript.json

{
	"manifest_version": 2,
	"name": "Admin Tools",
	"version": "0.3",
	
	"permissions": [
		"contextMenus",
		"tabs",
		"activeTab"
	],
	
	"content_scripts": [
		{
			"matches": ["https://*/*", "http://*/*"],
			"js": ["lead_partner_search_content.js"]
		}
	],
	
	"background": {
		"scripts": ["admin_search.js", "company_id_search.js","order_id_search.js","lead_partner_search.js"]
	}
}

lead_partner_search.js (后台脚本)

//lead_partner_search.js

var backgroundScriptMessage = " purple monkey dishwasher";

function returnMessage(messageToReturn) {
    chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
      var joinedMessage = messageToReturn + backgroundScriptMessage;
          alert("Background script is sending a message to contentscript:'" + joinedMessage +"'");
      chrome.tabs.sendMessage(tabs[0].id, {greeting: "hello"});
    });
}

chrome.contextMenus.create({
	"title": "Search leads by company name",
	"contexts": ["selection"],
	"onclick": returnMessage("test")
})

lead_partner_search_content.js (内容脚本)

//lead_partner_search_content.js

chrome.runtime.onMessage.addListener( function(request, sender) {
    alert("Contentscript has received a message from from background script: '" + request.message + "'");
    return true;
});

来自Stack Overflow的another示例,这应该显示一个警告:

  

后台脚本正在向contentcript发送消息:'test purple monkey dishwasher'

然后是第二个:

  

脚本已收到来自后台脚本的消息:'测试紫猴洗碗机'

然而,实际发生的情况是加载扩展时,即使触发上下文菜单条目,第一条消息警报也会立即显示,并且不会发生任何其他事情。

我不确定为什么会这样,并且不完全理解Google Chrome中的消息传递,尽管在此网站和其他网站上搜索信息。

感谢任何帮助。

1 个答案:

答案 0 :(得分:0)

根据评论中的建议,我可以将后台脚本更改为以下内容:

//lead_partner_search.js
function returnMessage() {
    chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
      chrome.tabs.sendMessage(tabs[0].id, {greeting: "hello"});
    });
}

chrome.contextMenus.create({
    "title": "Search leads by company name",
    "contexts": ["selection"],
    "onclick": returnMessage
})

我的内容脚本如下:

//lead_partner_search_content.js
chrome.runtime.onMessage.addListener( function(request, sender) {
    console.log("Contentscript has received a message from background script: '" + request.greeting + "'");
});

这会在控制台中产生所需的输出:

  

Contentcript收到了来自后台脚本的消息:' hello'

根据我现在所理解的情况,似乎我正在调用信息的一部分而不存在request.message我本来应该调用request.greeting因为这就是我宣布的内容从后台脚本发送消息时。