特定網頁與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"});
  };
})