javascript - 是否可以在选项卡内创建 firefox 插件 ui？

Question

我有一个 chrome 插件，我想移植到 Firefox。这个插件有一个复杂的用户界面，它占据了整个页面，它的目的是打开和使用很长一段时间，以及在浏览器中打开的其他页面。在 chrome 中，我只打开“.html”插件接口(interface)文件，它可以访问所有插件 api:与插件脚本等通信。但是如果我在 firefox 插件中打开“.html”文件:

var root = data.url('icon.png').split('/').slice(0, -2).join('/');
widget.Widget({
  id: 'my-addon',
  label: 'my addon',
  contentURL: data.url('icon.png'),
  onClick: function() {
    tabs.open([root, 'lib', 'control.html'].join('/'));
  }
});

页面内的 javascript 代码似乎无法访问 this.port 对象进行通信。创建全页插件界面的正确方法是什么？我是否需要通过 contentScriptFile 分别注入(inject) javascript 代码(非常糟糕，因为这在 chrome 中是完全不可能的，我将无法为两个插件使用相同的代码)或使用某种特殊类型的 Panel 所以它会全屏吗？

Answer 1

您可以在选项卡中打开 html 页面，然后使用 tab.attach附上实际的脚本。这样，您的脚本将是可以访问内容脚本 API 的实际内容脚本。

widget.Widget({
  id: 'my-addon',
  label: 'my addon',
  contentURL: data.url('icon.png'),
  onClick: function() {
    tabs.open({
      url: data.url("control.html"),
      onOpen: function(tab) {
        tab.attach({
          contentScriptFile: [data.url("control.js")],
          onMessage: function() {}
        });
      }
    });
  }
});

它很难看，但它应该可以工作(一般来说，我并没有实际尝试示例代码)。