显示来自firefox插件的图像'网页中的数据目录

Displaying images from firefox add-on's data directory in webpage

本文关键字：网页 数据目录 图像 firefox 插件 显示      更新时间：2023-09-26

我正在编写一个firefox插件，并有一个内容脚本可以根据我的意愿进行DOM操作，但我现在想在被操作的网页中显示插件数据目录中的一些图像（而不是在远程服务器上链接到它们），但我不知道该怎么做。

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

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

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

// 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);"
});

我在chrome.manifest中使用contentaccessible参数的引导插件中完成了这一操作：https://gist.github.com/Noitidart/9406437

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

相关文章：