canvas.toDataURL（）导致安全错误 [英] canvas.toDataURL() causing a security error

问题描述

我使用HTML5画布和通过的 .toDataURL（）函数=htt​​p://www.html5canvastutorials.com/kineticjs/html5-canvas -stage数据的URL与 - kineticjs /相对=nofollow> kineticJS的 .toDataURL（）方法。画布使用我的用户上传到网站，存储在不同的机器和子 farm1.domain.com 。

I'm using HTML5 canvas and the .toDataURL() function through KineticJS's .toDataURL() method. The canvas uses images that my users uploaded to the site, which are stored on a different machine and subdomain farm1.domain.com.

问题：：当 .toDataURL（）被调用时，我得到的错误

Problem: When .toDataURL() is called, I get the error

SECURITY_ERR: DOM Exception 18 

有没有办法解决？我还可以通过 domain.com 得到，如果用户访问该页面同样的问题，图像在 www.domain.com 。

Is there a way around this? I also get the same problem if the user access the page via domain.com and the image is hosted at www.domain.com.

尝试：

我添加虚拟主机内以下行的httpd.conf 并重新启动Apache服务。

I added the following lines to httpd.conf within virtualhost and restarted the apache service.

Header add Access-Control-Allow-Origin "http://www.domain.com"
Header add Access-Control-Allow-Origin "http://domain.com"
Header add Access-Control-Allow-Origin "http://farm1.domain.com"

在 domain.com www.domain.com 图像时，我仍然得到同样的错误>！有没有办法解决的KineticJS？

I still get the same error when accessing image hosted on www.domain.com from page on domain.com! Is there a way around this in KineticJS?

推荐答案

您将需要添加访问控制允许来源头的图像，你加载，不向其中加载它们的页面。有关此头的细节，和一般CORS，你可能需要阅读的 CORS不仅仅是XHR ，其中特别讨论了这个问题。

You will need to add the Access-Control-Allow-Origin headers to the images you are loading, not to the page which is loading them. For details on this header, and on CORS in general, you may want to read "CORS isn't just for XHR", which specifically discusses this issue.

这篇关于canvas.toDataURL（）导致安全错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！