画布被CORS图像污染

Question

我在画布（Pixastic）中使用启用CORS的图像时遇到问题。

在服务器上我有

Header set Access-Control-Allow-Origin "*"

在我的htaccess文件中。

在客户端，我尝试在HTML中设置交叉源属性，如下所示：

<img src="http://myseconddomain/image.jpg" crossorigin="anonymous" />

没有成功。之后，我尝试了Pixastic的代码：

var el = elements[i];
el.crossOrigin = 'anonymous';

也不起作用。

我还禁用了chrome的缓存，但它没有帮助。

Chrome正在记录：

Uncaught Error: SECURITY_ERR: DOM Exception 18 
Unable to get image data from canvas because the canvas has been tainted by cross-origin data.

即使HTML看起来很好（设置了crossorigin属性），图像标题看起来也很好（Access-Control-Allow-Origin）。。。我不知道下一步该做什么，所以欢迎任何建议！

不幸的是，我无法提供任何链接，因为正如你所猜测的，这个应用程序还远远没有生产出来。

Answer 1

我找到了一种方法，我会把它发布在这里，希望有一天它能帮助到别人。

碰巧我没有弄乱Pixastic代码中的正确函数，因为init（）函数并不总是像我最初想的那样被调用。

我在Pixasti.process（）函数中添加了以下行：

dataImg.crossOrigin = "anonymous";

它成功了。