将消息从网页发送到Chrome扩展 [英] sending message to chrome extension from a web page

问题描述

我想从随机网页的控制台发送消息到我的Chrome扩展。
chrome.extension.sendMessage似乎不起作用。 根据官方文档，您应该使用 postMessage 和 message 中的事件侦听器接收方。

以下是一个例子：

您网站的page.html

  var data = {type：FROM_PAGE，text：Hello from the webpage！ }; 
 window.postMessage（data，*）; 
  

内容脚本：（使用 chrome注入。 tabs.executeScript（tabid，{code：... ）

  window.addEventListener（message （event.source！= window）
 return; 
 
 if（event。 data.type&&（event.data.type ==FROM_PAGE））{
 console.log（Content script received message：+ event.data.text）; 
} 
}）; 
  

这里 page.html （它不是扩展名的一部分）将消息发布到自身，这些消息被内容脚本拦截并检查，反过来也可以通过类似的方式进行。

要从内容脚本传递到扩展，您必须使用其中一种可用的消息传递技术。

看起来很复杂它有点复杂，但所有这些庞然大物都非常安全。

I want to send message from the console of the random web page to my chrome extension. chrome.extension.sendMessage doesn't seem to work.

解决方案

According to the official docs you should use postMessage in the sender and message event listener in the receiver.

Here is an example:

Your website's page.html

var data = { type: "FROM_PAGE", text: "Hello from the webpage!" };
window.postMessage(data, "*");

Content script: (injected using chrome.tabs.executeScript(tabid, {code:...)

window.addEventListener("message", function(event) {
    // We only accept messages from ourselves
    if (event.source != window)
        return;

    if (event.data.type && (event.data.type == "FROM_PAGE")) {
        console.log("Content script received message: " + event.data.text);
    }
});

Here page.html (which is not a part of the extension) posts messages to itself, which are intercepted and inspected by the content script. The reverse is possible through similar means.

To pass from content script to extension, you will have to use one of the available message-passing techniques.

It looks complicated and it is somewhat complicated but all this mumbo-jumbo is very secure.

这篇关于将消息从网页发送到Chrome扩展的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！