特定网页与chrome扩展之间的通信

Question

我尝试在特定网页（例如：www.website.dev）和我创建的 chrome 扩展程序之间创建一个通信通道。

通过使用 postMessage，它可以从网页到扩展程序工作，但我不能从扩展程序到网页。

我试过谷歌例子，但它使用背景页面

谢谢你的帮助

编辑：抱歉，我不明白 content_script 和 background.js 之间的区别在我的清单中，我有 content script = test.js 什么是“背景”？

Answer 1

如果您知道扩展程序 ID，则可以按照文档将消息传递给您的扩展程序： https : //developer.chrome.com/extensions/messaging#external-webpage

清单文件

"externally_connectable": {
  "matches": ["*://*.example.com/*"]
}

网站：

// The ID of the extension we want to talk to.
var editorExtensionId = "abcdefghijklmnoabcdefhijklmnoabc";

// Make a simple request:
chrome.runtime.sendMessage(editorExtensionId, {openUrlInEditor: url},
  function(response) {
    if (!response.success)
      handleError(url);
  });

延期：

chrome.runtime.onMessageExternal.addListener(
  function(request, sender, sendResponse) {
    if (sender.url == blocklistedWebsite)
      return;  // don't allow this web page access
    if (request.openUrlInEditor)
      openUrl(request.openUrlInEditor);
  });

Answer 2

您将在文档https://developer.chrome.com/extensions/messaging 中找到所有详细信息

您可以让一个部分使用 sendMessage 函数，而另一部分正在侦听事件，该事件可以是网页或内容脚本。

要么网页的内容脚本应该启动通信（这样您就可以获得标签 ID），或者您可以对具有特定 url 的标签进行后台查询，然后使用 sendMessage。 注意这里使用了两个单独的函数chrome.extension.sendMessage和chrome.tabs.sendMessage 。

以下代码对我有用：

content_script.js：

chrome.extension.sendMessage({"msg":"hello"});

背景.js：

chrome.extension.onMessage.addListener(function (request, sender, sendResponse) {
  if (request.msg == "hello"){
    senderTab = sender.tab.id;
    chrome.tabs.sendMessage(senderTab, {"msg": "ehlo"});
  };
})