使用 Firefox 附加 SDK 进行跨域图像数据检索答案

【问题标题】：Cross-Domain ImageData Retrieval with Firefox Add-on SDK使用 Firefox 附加 SDK 进行跨域图像数据检索
【发布时间】：2014-05-08 19:44:50
【问题描述】：

我正在开发一个 Firefox 插件，它涉及从网络上的任意图像读取像素图像数据。

对于 Chrome、Safari 和 Opera，这就像在后台页面的画布上加载图像一样简单（getImageData 有效并且忽略同源限制）。但在 Firefox 上，使用附加 SDK 创建 "trusted" page-worker 并在从任意 URL 加载的图像上调用 getImageData 会产生安全错误。

- message = The operation is insecure.
- name = SecurityError
- result = 2152923154

我一直在翻阅 Add-on SDK 和其他 StackOverflow 答案的文档，似乎内容脚本通常仍受同源策略的约束。 PrivilegeManager/enablePrivilege（我什至不确定这是否相关）似乎已被弃用。

我目前能想象的唯一方法是低级 net/xhr XMLHttpRequest API，请求类型为 Blob，并使用 createObjectURL 加载图像。但这似乎有点不必要地令人费解，当我觉得应该有某种方法来调用 getImageData 而不会在特权上下文中遇到同源策略。

【问题讨论】：

标签： javascript firefox canvas firefox-addon firefox-addon-sdk

【解决方案1】：

你需要的是一个特权canvas，我认为没有办法从内容脚本中获得一个，不管是否信任。

不过，我们并非没有选择。

var chromewin = require('sdk/windows/utils').getHiddenWindow();
var canvas = chromewin.document.createElementNS('http://www.w3.org/1999/xhtml',
                                                'canvas');
var img = new chromewin.Image;

现在您可以不受安全限制地工作了。

【讨论】：

【解决方案2】：

尝试var blah = new Image 然后执行blah.onload = function() { canvas.data...... } 然后执行blah.src = '....'

【讨论】：