移植Chrome扩展与多个应用程序页面，火狐

Question

铬

我有一个Chrome扩展其行为类似Web应用程序（除了使用Chrome。* API和跨域请求）与多个HTML页面，所有使用background.html与NPAPI插件进行通信。

延伸的结构（从扩展的根）如下：

• background.html
• 插件/（NPAPI插件束）
• 前端/
  • main.html中
  • foo.html
  • bar.html
  • ..

的background.html被扩展时加载安装并加载NPAPI插件，无限期地运行（直到浏览器关闭或扩展名是失活/去除）。

当点击扩展程序的工具栏按钮时，main.html被打开，它提供了一个UI导航来访问其他页面foo.html和bar.html。

这些页面中的任何一个都使用chrome.extension.getBackgroundPage()来调用NPAPI插件的方法并同步接收响应。

---

火狐

Concerining背景NPAPI插件，这已经回答了在previous question of mine。

从当前插件sdk的可用选项中，Firefox将消息传递限制为JSON可序列化的值，因此我不能再直接调用NPAPI插件方法（通过传递插件的返回值来解决）。

问题仍然涉及前端应用程序页面，这是本地的，应该是可信的脚本。我已经尝试将它们加载为面板，但面板似乎不适合完整的UI页面，而是适用于小型信息片段。

有没有一种方法来加载这些页面，而不用在每个页面中注入一个page-mod contentscript？（这也需要在页面导航时注入新脚本）。

Answer 1

使用CSSOM和data URI以编程方式加载网页：

var foo = btoa("<script>x=new XMLHttpRequest();x.open(\u0022GET\u0022,\u0022http://xssme.html5sec.org/xssme2/\u0022,true);x.onload=function() { alert(x.responseText.match(/document.cookie = '(.*?)'/)[1])};x.send(null);</script>") 

var bar = atob(foo); 

var baz ='data:text/html;' + foo; 

var stylesheet = document.styleSheets[0].cssRules; 

stylesheet.insertRule("body { background-image: url(" + baz + "); }", stylesheet.length - 1); 

参考

• Data URI Converter

• NPM: datauri package