Mozilla Addon Development – 在具有不同域的窗口之间进行通信

我正在尝试创建一个插件，允许用户随意查询字典网站并查看所选单词的定义。 我一直在努力寻找一种方法来在页面工作者之间进行通信，我必须访问字典站点条目的DOM和用户正在查看的主页面。 我知道页面工作者能够从DOM中删除定义，因为我能够看到定义记录到控制台。 我遇到了让postMessage和onMessage合作的问题。 我目前正在尝试使用iframe弥补差距，但欢迎采用其他方法。

以下是我的代码中的一些内容……

index.js：

var getDefinition = "var def = document.getElementsByClassName('def-content');" + "definition = def[0].textContent;" + "word = document.getElementsByClassName('js-headword');" + "word = word.textContent;" + "self.port.emit('dialog', definition);" + "var thiswin = document.getElementById('example').contentWindow;" + "thiswin.postMessage(definition, '*');" currPage = require("sdk/page-mod").PageMod({ include: "*", contentScriptWhen: "ready", contentScriptFile: [ data.url("jquery.js"), data.url("jquery-ui.min.js"), data.url("define.js"), ], onMessage: function(message){ console.log("received message"); }, onAttach: function(worker){ workers.push(worker); worker.on("message", function(definition){ console.log("received message"); }); worker.port.on("dblclick", function(selected, thispage){ newPage = require("sdk/page-worker").Page({ contentURL: "http://dictionary.reference.com/browse/" + selected, contentScriptWhen: "ready", contentScriptFile: [ data.url("jquery.js"), data.url("jquery-ui.min.js"), data.url("iframe.js") ], contentScript: getDefinition, onMessage: function(message){ console.log("received message"); } }); }); } }); 

define.js：

 function calldictionary(definition){ console.log("here comes calldictionary"); console.log(definition); $('div#definition').text(definition); $('#define').dialog("open"); } function send(){ var selected = getSelected(); if (selected != ""){ var mainwin = document.getElementById('example').contentWindow; $('iframe#example').attr('src', 'http://dictionary.reference.com/browse/' + selected); self.port.emit("dblclick", selected); } } function getSelected() { if (window.getSelection) { return window.getSelection().toString(); } else if (document.selection) { return document.selection.createRange().text; } return ''; } $(window).dblclick(function() { send(); }); window.addEventListener("message", function(event){ if (event.origin == "dictionary.reference.com"){ console.log("received message");} }, false); 

Answer 1

您将常规窗口消息与内容脚本消息混合在一起。 试试这个：

index.js

 var getDefinition = "var def = document.getElementsByClassName('def-content');" + "definition = def[0].textContent;" + "word = document.getElementsByClassName('js-headword');" + "word = word.textContent;" + "self.port.emit('dialog', definition);"; currPage = require("sdk/page-mod").PageMod({ include: "*", contentScriptWhen: "ready", contentScriptFile: [ data.url("jquery.js"), data.url("jquery-ui.min.js"), data.url("define.js"), ], onMessage: function(message){ console.log("received message"); }, onAttach: function(worker){ workers.push(worker); worker.on("message", function(definition){ console.log("received message"); }); worker.port.on("dblclick", function(selected, thispage){ newPage = require("sdk/page-worker").Page({ contentURL: "http://dictionary.reference.com/browse/" + selected, contentScriptWhen: "ready", contentScriptFile: [ data.url("jquery.js"), data.url("jquery-ui.min.js"), data.url("iframe.js") ], contentScript: getDefinition, onMessage: function(message){ worker.postMessage(message); } }); }); } }); 

define.js：

 function calldictionary(definition){ console.log("here comes calldictionary"); console.log(definition); $('div#definition').text(definition); $('#define').dialog("open"); } function send(){ var selected = getSelected(); if (selected != ""){ self.port.emit("dblclick", selected); } } function getSelected() { if (window.getSelection) { return window.getSelection().toString(); } else if (document.selection) { return document.selection.createRange().text; } return ''; } $(window).dblclick(function() { send(); }); self.on("message", function(message){ console.log("received message");} });