javascript - 从 web_accessible_resource 到内容脚本的 window.postMessage

Question

我尝试将来自 web_accessible_resource 的消息发布到我的 chrome 扩展的内容脚本。

我的设置：

我的 manifest.json 的一部分：

"content_scripts": [{
  "matches": ["http://*/*"],
  "js": ["content.js"]
}],
"web_accessible_resources": ["run.js"]

内容.js

// this listener is never triggered ;-(
chrome.extension.onMessage.addListener(function(request, sender, sendResponse) { 
  if (request.type === 'foo') {
    // do whatever i want if request.type is foo       
  }
});

运行.js

window.postMessage({type: 'foo'}, '*');

我也尝试过的东西：

直接在run.js中添加监听器：

window.addEventListener("message", function(msg) {
  if (msg.data.type === 'foo') {
    // that one works
  }
});

从后台脚本发布消息：

chrome.tabs.getCurrent(function (tab) {
  chrome.tabs.sendMessage(tab.id, {type: "foo"});
});

问题：

我需要做什么？我是否需要为我的内容脚本设置一些授权或其他东西，或者为什么这不起作用？？？

Answer 1

您现在可以启用 api 将消息直接从网页发送到您的扩展程序 ID

在清单中启用

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

从网页发送消息：

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

接收扩展：

chrome.runtime.onMessageExternal.addListener(function(){});

请参阅：https ://developer.chrome.com/extensions/messaging#external-webpage

Answer 2

就在我问我的问题时，我有一个想法，当然……

...工作。

当然我需要在我的 content.js 中附加一个 window.addEventListener：

window.addEventListener("message", function(e) {
  if (e.data.type === 'closeSidebar') {
    // that works now
  }
});