如何将消息从面板发送到页面mod'的内容脚本

How to send message from panel to page-mod's content script directly?

本文关键字：mod 脚本 消息      更新时间：2023-09-26

如果Firefox插件中有如下代码片段：

var pagemod = PageMod({
    include: ['*'],
    contentScriptFile: [data.url('content.js')]
});
panel = require("sdk/panel").Panel({
  width: 322,
  height: 427,
  contentURL: data.url("main.html"),
  include:["http://*/*","https://*/*"],
  contentScriptFile: [data.url('panel.js')]  
});

我在Chrome扩展中找到了一些示例代码。它们使用window.parent.postMessage(message, "*")发送消息，使用window.addEventListener("message",function (e) {//do something}接收消息。如何在Firefox插件中直接将消息从"panel.js"发送到"content.js"？

解决方案的概念与以下答案非常相似：

  1. 维护每个选项卡的消息端口列表
  2. 如果要发送消息，请向所有列出的端口发送消息

以下代码用于维护端口列表：

var ports = [];
var pagemod = PageMod({
    include: ['*'],
    contentScriptFile: [data.url('content.js')],
    onAttach: function(worker) {
        ports.push(worker.port);
        worker.on('detach', function() {
            var index = ports.indexOf(worker.port);
            if (index !== -1) ports.splice(index, 1);
        });
    }
});

现在，每当您想从panel.js发送消息时，只需使用：

// panel.js
self.port.emit('message-to-tabs', 'example of message');

在创建面板后，必须在主脚本中处理消息：

panel = require('sdk/panel').Panel({
    width: 322,
    height: 427,
    contentURL: data.url('main.html'),
    include: ['http://*/*', 'https://*/*'],
    contentScriptFile: [data.url('panel.js')]  
});
panel.port.on('message-to-tabs', function(message) {
    for (var i=0; i<ports.length; i++) {
        ports[i].emit('message-to-tab', message);
    }
});

在选项卡的内容脚本（content.js）中，您可以监听此事件并按如下方式处理：

self.port.on('message-to-tab', function(message) {
    // Do something with message
});
相关文章：