在网页中显示来自firefox附加组件数据目录的图像

时间:2014-10-11 15:28:23

标签: javascript firefox-addon firefox-addon-sdk

我正在编写一个firefox插件,并有一个内容脚本可以根据需要进行DOM操作,但我现在想要在操作的网页中显示来自我的附加组件数据目录的一些图像(而不是链接)他们在远程服务器上)但我不知道该怎么做。

我看到附加模块和内容脚本之间的通信应该通过port.emit完成,但是API表示该参数必须是JSON可序列化的。

以前有人这样做过吗?我觉得我错过了什么。

2 个答案:

答案 0 :(得分:3)

虽然您可以将resource: uri硬编码到数据目录中,但最好在运行时构建它。这是在@loader/options伪模块的帮助下完成的,但前向兼容的方式是通过self模块。如果您没有其他理由使用port机制,则可以通过contentScriptOptions参数将uri传递给内容脚本。您的内容脚本可以从self.options访问它。以下代码将在mylogo.jpg域的每个页面插入mozilla.org

// var options = require("@loader/options");
// options.prefixURI + options.name + "/data/" works now but may change in the future
var pageMod = require("sdk/page-mod");
var self = require("sdk/self");

pageMod.PageMod({
  include: "*.mozilla.org",
  contentScriptOptions: {prefixDataURI: self.data.url("")},
  contentScriptWhen: "ready",
  contentScript: "var img = document.createElement('img');" +
                 "img.src = self.options.prefixDataURI + 'mylogo.jpg';" +
                 "document.body.appendChild(img);"
});

答案 1 :(得分:2)

我在chrome.manifest中的contentaccessible参数的引导插件中执行了此操作:https://gist.github.com/Noitidart/9406437

对于addon-sdk,它听起来像你在做,我想这样做:只需将图像放入数据文件夹即可。然后使用self.data.url('img_name')为您提供resource://路径,在网页中使用该路径。它应该工作,资源路径没有安全问题我很确定。