如何将一个本地文件的同源策略违规绕过到另一个本地文件？

Posted 2023-02-27

【中文标题】如何将一个本地文件的同源策略违规绕过到另一个本地文件？

【英文标题】：How do I bypass a same origin policy violation for one local file to another?

【发布时间】：2010-11-05 15:48:20

【问题描述】：

我正在尝试使用未托管在服务器上的文件半重新创建 Mozilla 的 demo 使用 javascript + <video> + <canvas>。

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

错误：未捕获的异常：[异常...“安全错误”代码：“1000”nsresult：“0x805303e8 (NS_ERROR_DOM_SECURITY_ERR)”位置：“file:///media/disk/javascript/html5/chromakey/chromakey1. htm 行：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"  ></video>

有什么方法可以在不使用 JAR 签名我的代码的情况下克服这个错误？

我认为这与 Firefox 的同源策略 (https://developer.mozilla.org/en/Same_origin_policy_for_JavaScript) 存在本地文件访问问题有关，但我不知道从那里去哪里。

【参考方案1】：

您需要从同一来源访问文件，我认为 file:// 协议出于明显的安全原因受到非常严格的限制。

只有具有更多权限的扩展才能访问这些文件。

【参考方案2】：

从文件系统中，每个文件都在不同的来源（这可以防止访问例如/etc/passwd——比如说使用XMLHttpRequest 或iframe，然后使用查询将数据传递到Web 上的某个服务器——加载 <img> 或通过 javascript 自动发送表单时的字符串）。见https://datatracker.ietf.org/doc/html/draft-abarth-origin（它讲的是“实现定义的值”，最简单的是每个文件都有一个不同的来源）

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

可能有一个使用 Firefox's "per-file permission" 的解决方案，但考虑到运行本地 HTTP 服务器有多便宜，我不确定它是否真的值得......（YMMV）

【参考方案3】：

Firefox 的文件访问源策略可以在“about:config”中更改。 要消除文件的同源策略：URI，请更改 security.fileuri.strict_origin_policy 为 false。Mozilla;about:config;origin_policy setting