同源策略，google chrome，canvas和file：// scheme [英] Same origin policy, google chrome, canvas and file:// scheme

问题描述

当尝试从预先绘制图像的画布中读取图片数据时，Google Chrome会引发跨原点异常（抱怨画布被污染）。目录结构如下。

When trying to read image data from a canvas which was painted an image upon beforehand, Google Chrome raises a cross origin exception (complaining about the canvas being "tainted"). The directory structure is as follows.

/html/base/path
|-- index.html         contains the canvas element, references the script.js
|-- script.js          loads imgs/images.jpg, paints and queries the canvas
`-- imgs/image.jpg

只有当页面由文件：// scheme加载时才会出错。

The error occurs only when the page was loaded by the file:// scheme.

我想知道这是否是Chrome的bug。如果没有，哪些规则适用？有什么解决方法吗？

I wonder whether this is a Chrome bug. If not, which rules do apply? Are there any workarounds?

不幸的是，离线观看是最终的用例，因此

Unfortunately, off-line viewing is the ultimate use case, so

• 文件：//方案是必不可少的


• 在目标系统上无法控制浏览器设置。

推荐答案

加载了 file：// 的文件总是被认为来自不同的域，

Files loaded with file:// are always considered as coming from different domains, this is a feature you can't bypass.

从 HTML5规范的Origin 定义：

如果以其他方式获取文档：URL
由用户输入，a使用createDocument（）
API创建的文档等等）origin是创建
文档时分配的全局唯一标识符。

If a Document was obtained in some other manner (e.g. a data: URL typed in by the user, a Document created using the createDocument() API, etc) The origin is a globally unique identifier assigned when the Document is created.

您可以显示，但是如果加载协议为 file，则无法分析或更改从另一个文件读取的数据： code>。

You can display but you can't analyze or change data read from another file if the loading protocol is file:.

在您的情况下可能会发生什么从你的意见中正确地理解它）：我会写一个小程序，可以在外部存储介质中发布，这将启动一个http服务器和启动一个Web浏览器。 我会在Go（简单的使http服务器在两行或三行，本机编译为linux，Mac和Windows，使您可以提供所有必需的可执行文件），但其他语言也可以使用。

What I would probably do in your situation (if I understand it correctly from your comments) : I would write a tiny program, that could be released in the external storage media, which would both start an http server and launch a web browser. I would do it in Go (simple to make an http server in two or three lines, native compilation for linux, Mac and Windows, enabling you to provide all needed executables) but other languages can be used too.

这篇关于同源策略，google chrome，canvas和file：// scheme的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！