How do I bypass a same origin policy violation for one local file to another?

问题

I'm trying to semi-recreate Mozilla's demo usage of JavaScript + <video> + <canvas> with files that aren't hosted on a server.

Loading my document causes the error console to report this error:

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"]

Here's line 23:

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

It's trying to get the image data from a canvas to which I previously copied a frame of video like this:

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

Where this.inputElement references this (fairly boring) element:

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

Is there any way to get past this error without signing my code with a JAR?

I think it has to do with Firefox's same origin policy (https://developer.mozilla.org/en/Same_origin_policy_for_JavaScript) having an issue local file access, but I can't figure out where to go from there.

回答1:

From the filesystem, each file is in a different origin (this prevents accessing e.g. /etc/passwd –let's say using an XMLHttpRequest or an iframe, and then pass data to some server on the Web using the query-string when loading an <img> or automatically sending a form though javascript). See http://tools.ietf.org/html/draft-abarth-origin (it talks about "implementation-defined value", and the easiest is to have a distinct origin per file)

The easiest way to workaround your issue is to run an HTTP server.

There might be a solution using Firefox's "per-file permission" but I'm not sure it's really worth it given how cheap it is to run a local HTTP server... (YMMV)

回答2:

You need to access the file from the same origin, and I think that the file:// protocol is very restricted for obvious security reasons.

Only extensions could access these files, with more privileges.

回答3:

Firefox's origin policy for file access can be changed in "about:config". To eliminate the same origin policy on file: URIs, change the "true" value of security.fileuri.strict_origin_policy to false.Mozilla;about:config;origin_policy setting

来源：https://stackoverflow.com/questions/1040724/how-do-i-bypass-a-same-origin-policy-violation-for-one-local-file-to-another

标签

javascript

security

html5

canvas

same-origin-policy