Question

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

通过使用postMessage，它可以在网页上工作，但从扩展到网页，我无法做到这一点。

我尝试了Google示例，但它使用了背景页

感谢您的帮助

编辑：抱歉，我不明白content_script和background.js之间的区别在我的清单中，我有内容script = test.js 什么＆＃34;背景＆＃34; ？

Answer 1

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

manifest.json

"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

网页的内容脚本应该启动通信（因此您将获得选项卡ID），或者您可以对具有特定URL的选项卡进行后台查询，然后使用sendMessage。请注意此处使用的两个单独的函数chrome.extension.sendMessage和chrome.tabs.sendMessage。

以下代码适用于我：

<强> content_script.js：

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

<强> background.js：

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

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

2 个答案: