Javascript 上载文件的canvas toDataURL在同一域上引发安全错误

因此，通过文件输入选择图像，所选图像文件将转换为window.url.createobjecturl并未经修改地传递给隐藏的img元素，然后图像元素当前数据的预览将呈现到画布元素中。到目前为止，一切顺利。但是，当我试图呈现canvas.toDataURL时，我不断得到一个令人恼火的安全异常，即它不安全。这发生在chrome和firefox上

请理解，这是一个使用html输入元素选择的文件对象，而不是通过file://url选择的，并且该网页是一个实际的网页，并且是通过http://而不是通过file://加载的

图像文件甚至还没有离开浏览器进入服务器，因此不应该存在任何域问题。它只是一个被断言为图像源的原始blob，然后告诉画布更新其预览，确实如此。之后，当试图保存画布内容时，浏览器会触发一个错误

我已经阅读了所有关于canvas元素被污染的场景的规范，而这个场景不符合这些场景中的任何一个

我在mozilla演示中看到过一个类似的例子，其中有人提供代码片段，向人们展示如何做同样的事情，但我没有看到有人在这方面有问题

有什么想法吗？短暂性脑缺血发作

==更新===

好吧，我已经知道问题出在哪里了，但我仍然不清楚为什么会有问题。以下是设置：

1页称为via，例如example.com/

2通过以下途径调用脚本：r.example.com/script.js

3如果脚本从r.example.com加载任何图像以用于页面设计，而不是画布，那么它将如何污染整个页面。在本例中，我通过javascript绘制整个页面，因此页眉图像污染了页面的其余部分。如果我将标题图像更改为来自example.com而不是r.example.com，画布抱怨不安全的问题就会消失，一切都会好起来

我不明白的是为什么会这样。头映像与javascript文件从同一个位置加载，为了参数起见，我甚至将主域和子域的访问控制allow origin都设置为*，这没有什么区别

因此，可以从任何地方进行访问控制，标题图像与javascript文件来自同一个位置，并且它没有被绘制到用户文件的画布上，那么为什么通过javascript绘制标题图像会污染与之无关的画布？？？此外，css和其他媒体从同一子域加载，但这不会影响页面，只要脚本没有加载它们[o_0]

---

我想将我的所有资源保留在一个单独的子域上以实现可伸缩性，因此，这个问题令人沮丧，因为我不太明白为什么它仍然在发生…

您似乎必须在图像对象本身上设置此属性，因为它最初没有域[o_0]

img.origin = 'mydomain.com'

---

如果希望图像位于单独的子域上，则必须更改图像的原点，以允许所有子域都是这样的：

img .origin = '*.mydomain.com'

我将canvas与kineticJS一起使用，并自己进行了测试