google-chrome-extension - Google Chrome 扩展 - 消息 + 调用弹出页面和内容脚本之间的功能

Question

在 Google Chrome 扩展程序中，我想在内容脚本和弹出页面之间传递消息。我还希望在弹出页面向内容脚本发送执行此操作的信号时触发内容脚本中的一个函数。

Google Chrome 扩展程序开发人员文档中的消息部分指出消息可以“从您的内容脚本传递到扩展程序页面，反之亦然”(引自 http://code.google.com/chrome/extensions/messaging.html)

这是否意味着我可以在内容脚本和弹出页面之间发送/接收消息？因为我看到的用法是用于后台页面和内容脚本之间的通信。

或者我是否必须设置一个 3 路消息传递路由 - 即。
内容脚本<--> 背景页面<--> 弹出页面。如果是这种情况，我如何在后台页面 <--> 弹出页面之间设置消息传递？

从弹出页面向内容脚本发送信号后，如何在内容脚本中触发函数？这是否还需要存在后台脚本？

Answer 1

内容脚本只能向后台页面发送消息。如果要将消息从内容脚本发送到弹出窗口，则必须:

将消息从内容脚本发送到后台页面。

chrome.runtime.sendMessage( ...message... , function() { /*response*/ });

在后台接收消息。

chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) { ... });

将消息传递到弹出窗口。获取对全局的引用 window弹出窗口的对象，使用 chrome.extension.getViews .注意:与大多数其他 chrome API 不同，此方法是同步的:

var popupWindows = chrome.extension.getViews({type:'popup'});
if (popupWindows.length) { // A popup has been found
    // details is the object from the onMessage event (see 2)
    popupWindows[0].whatever(message, sendResponse);
}

在弹出窗口中，定义 whatever方法。

function whatever(message, sendResponse) {
    // Do something, for example, sending the message back
    sendResponse(message);
}

当sendResponse (4) 被称为，details.sendResponse (见3)被调用。这反过来又调用 function() { /*response*/ }从 1.

注: chrome.runtime.sendMessage/ onMessage仅在 Chrome 26+ 中受支持。使用 chrome.extension.sendMessage如果您也想支持旧版浏览器。