如何使用Firefox SDK插件将iframe附加到托管页面?

时间:2015-05-04 07:15:03

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

假设Firefox SDK插件中的数据文件夹中有frame.html个, 如何附加iframe并定义frame.html作为其来源?

其他信息: 由于CPS,它不可能使用内联源,所以我不能使用data.load('frame.html'),我需要使用该文件的URL:

LIB / main.js

tabs.activeTab.attach({
  contentScriptFile: [self.data.url("js/appender.js") ],
  attachTo: 'top',
  contentScriptOptions: {
    scriptUrl: self.data.url("js/sandbox.js"),
    imageUrl: self.data.url("image.jpg")
    frameUrl: self.data.url("sandbox.html")
  }
});

数据/ appender.js

  var scriptTag = document.createElement("script");
  scriptTag.src = self.options.scriptUrl;
  document.body.appendChild(scriptTag); // worked fine

  var imageTag = document.createElement("image");
  imageTag.src = self.options.imageUrl;
  document.body.appendChild(imageTag); // worked fine

  var iframeTag = document.createElement("iframe");
  iframeTag.src = self.options.frameUrl;
  document.body.appendChild(iframeTag); // the html tag of iframe is empty

1 个答案:

答案 0 :(得分:3)

由于firefox安全策略不允许内容脚本将资源URL加载为iframe,因此它是空白的。解决方案可能是直接从后台脚本设置它,为此你需要使用低级sdk。

var { viewFor } = require("sdk/view/core");
var tab_utils = require("sdk/tabs/utils");

var iframe = viewFor(tab).linkedBrowser._contentWindow.document.querySelector('iframe[src="' + self.data.url("sandbox.html") + '"]')
iframe.contentWindow.location.href = iframe.getAttribute("src")

所以完全正常工作的代码看起来像:

数据/ appender.js

var iframeTag = document.createElement("iframe");
iframeTag.src = self.options.frameUrl;
document.body.appendChild(iframeTag); // the html tag of iframe is empty

// note that the iframe is attached after the content ready event, so you have to inform the background when it can start working with the iframe
self.port.emit("attached", true);

main.js

tabs = require("sdk/tabs")
self = require("sdk/self")

var { viewFor } = require("sdk/view/core");
tab_utils = require("sdk/tabs/utils");

tabs.on("ready", function(tab) {
  var worker = tab.attach({
    contentScriptFile: [self.data.url("js/appender.js") ],
    attachTo: 'top',
    contentScriptOptions: {
      frameUrl: self.data.url("sandbox.html")
    }
  });

  worker.port.on('attached', function() {
    reinitIframe(tab)
  });

  function reinitIframe(tab) {
    var iframe = viewFor(tab).linkedBrowser._contentWindow.document.querySelector('iframe[src="' + self.data.url("sandbox.html") + '"]')
    iframe.contentWindow.location.href = iframe.getAttribute("src")
  }
})

您可能需要一个cross-process wrapper才能在未来版本的电解版Firefox中使用