一个现象让我对canvas的Crossorigin产生疑问！！

[wblicsdn]

网上找到的资料说canvas要绘制跨域图片的话，不但要图片所在服务器设置跨域权限，还要为canvas设置一个CrossOrigin="anonymous"，由于项目原因，我部署了一个测试服务器，并且设置为不允许跨域，然后我根据w3cschool提供的教程，写了一个最简单的canvas绘制图片的代码，图片地址用的是我部署的服务器中的图片。然后我在本地部署了我的代码，发现可以显示图片？这是为什么？！！不是被限制跨域了吗，难道我理解错误？ 下面是我贴的代码：

<canvas id="myCanvas" width="200" height="100" style="border:1px solid #c3c3c3;"></canvas>

<script type="text/javascript">
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
var img=new Image();
img.src="http://119.23.213.80:8080/g3.png";
img.onload = function() {
cxt.drawImage( img, 0, 0 );
}

PS我是通过服务端设置 access-control-allow-origin来开放或关闭跨域的，我跟同事测试了几遍了，开开关关，发现论如何都可以显示图片，但是有一点值得注意的是：开发者工具的network中 header中的 response header中是没有access-control-allow-origin：“*”的，因为服务器没设置， 而header后面的preview是有图片预览的，preview后面的response是没有数据的，意思就是服务器没有响应，但是图片也没有显示来自缓存 from cache，因为我用的ctrl+f5。

说以这个Crossorigin用处是什么？哪些情况下才需要用？是否我理解错误了，求科普。

[天际的海浪]

canvas的跨域限制不是指不能绘制跨域的图片， 而是指，一旦在canvas中绘制了跨域的图片，canvas画布对象就会被污染，之后就不能用getImageData()或toDataURL()获取画布内的像素数据了。

[wblicsdn]

引用 1 楼 jslang 的回复:

canvas的跨域限制不是指不能绘制跨域的图片， 而是指，一旦在canvas中绘制了跨域的图片，canvas画布对象就会被污染，之后就不能用getImageData()或toDataURL()获取画布内的像素数据了。

多谢大神回复，我刚才也找到了一个网站有说到这个问题，那么我还想问一下大神几个问题： 1，我帖子中的preview是有图片预览的，preview后面的response是没有数据的。这个是否就是因为后台没开放跨域，所以response没响应，然后因为canavs可在这种情况下绘制图片，所以preview中才有图像？ 2，我在前端如何判断后台是否开放跨域权限，是通过查看response header中是否有“access-control-allow-origin”吗？（因为我项目中的后台人员表示他们设置好了跨域，但是我前端仍然一直提示跨域问题，而且不是请求链接的问题，请求链接只是获取图片地址而已，应该是在绘图的环节提示的，所有我有点怀疑后台没处理好，然而他们有没注意）；

[天际的海浪]

对于图片来说，response本来就是没有数据的 如果后台正确开放跨域权限，应该是能在response header中看到access-control-allow-origin的啊