javascript-如何将一个本地文件的同一原始策略冲突绕到另一个本地文件？

我试图半重新创建Mozilla的demo使用的JavaScript< video> <画布>使用未托管在服务器上的文件.

加载我的文档会导致错误控制台报告此错误：

Error: uncaught exception: [Exception… “Security error” code: “1000” nsresult: “0x805303e8 (NS_ERROR_DOM_SECURITY_ERR)” location: “file:///media/disk/javascript/html5/chromakey/chromakey1.htm Line: 23”]

这是第23行：

this.referenceImageData = this.bCtx.getImageData(0, 0, this.bufferCanvas.width, this.bufferCanvas.height);

它正在尝试从我先前将视频帧复制到的画布上获取图像数据,如下所示：

this.bCtx.drawImage(this.inputElement,
    0, 0,
    this.inputElement.width, this.inputElement.height,
    0, 0,
    this.bufferCanvas.width, this.bufferCanvas.height
);

其中this.inputElement引用此(相当无聊)的元素：

<video id="MainInput" src="320x240.ogg" width="320" height="240"></video>

有没有办法解决这个错误而无需用JAR签名我的代码？

我认为这与Firefox的原始策略(https://developer.mozilla.org/en/Same_origin_policy_for_JavaScript)有关,该策略具有本地文件访问问题,但我不知道从那里去哪里.

解决方法:

从文件系统来看,每个文件都来自不同的源(这可以防止使用XMLHttpRequest或iframe来访问/ etc / passwd-例如,然后在加载<时使用查询字符串将数据传递到Web上的某些服务器. img>或通过javascript自动发送表单).请参阅http://tools.ietf.org/html/draft-abarth-origin(它讨论的是“实现定义的值”,最简单的是每个文件都有不同的来源)

解决问题的最简单方法是运行HTTP服务器.

可能有一个使用Firefox’s “per-file permission”的解决方案,但鉴于运行本地HTTP服务器的价格如此便宜,我不确定这是否真的值得…(YMMV)

标签：same-origin-policy,html5,security,canvas,javascript
来源： https://codeday.me/bug/20191024/1920819.html