Question

我有一个用户在浏览器上安装的chrome扩展程序，当你打开扩展程序弹出窗口（后台页面）时，它所做的就是加载在我的服务器上运行的整个应用程序后端。

我想要做的是在我的后端应用程序上安装某种事件发射器，它可以将消息发送回加载此应用程序的chrome扩展。

我试过这个：

background.html：

<body>
    <iframe id="gateway" src="http://www.catchit.com"></iframe>
</body>

我的发送消息的后端页面，例如： www.catchit.com/message/send ，点击后运行：

var event = new CustomEvent(
    "newMessage",
    {
        detail: {
            users: users,
            message: message
        },
        bubbles: true,
        cancelable: false
    }
);

document.dispatchEvent(event);

我的内容脚本等待此事件：

document.addEventListener("newMessage", function(data) {
    chrome.runtime.sendMessage(data);
});

我的后台脚本：

chrome.runtime.onMessage.addListener(function(message) {
    alert("message received" + message);
});

但当然它不会起作用......因为，事件是在iframe背景下触发的（www.servera.com）

我在这里缺少什么？我无法弄清楚如何回复消息。这将是扩展程序弹出窗口中加载的实际应用程序与扩展程序本身之间的一个很棒的桥梁，后者可以稍后将消息发送到用户浏览器上打开的网站。

由于

Answer 1

基于gonzalovazzquez所说的，我已经提出了这个解决方案：

Background.js：

// Listen for message from application (iframe)
top.window.addEventListener("message", function(message) {
    // Notify content-script about new message
});

我的应用程序javascript是iframe应用程序的一部分：

top.window.postMessage({data: {users: users, message: message}}, "*");
return false;

从那时起，您可以根据在background.html上iframe中加载的应用程序收到的消息，通过背景告诉您的内容脚本在实际页面/标签上的操作

从加载的iframe将消息发送回chrome扩展程序

1 个答案: