简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW)
javascript - <img >加上crossOrigin="anonymous"之后导致图片无法显示
迷茫
迷茫 2017-04-11 12:34:53
0
2
1498

主要是想对跨域的图片进行裁剪保存
先是出现canvas.toDataURL()报错 网上资料说需要添加crossOrigin="anonymous"允许跨域
但加了之后图片就无法显示了 我又新建了一个页面发现 只要是<img>加了crossOrigin="anonymous"就都无法显示 求大神帮忙，谢谢。

迷茫
迷茫

业精于勤，荒于嬉;行成于思，毁于随。

reply all(2)
伊谢尔伦
伊谢尔伦2017-04-11 12:36:53 2 floor

你从哪里找的答案。误人子弟啊，Access-C...A...O...字段是服务端添加了才有的，"响应头中就会附加"是什么鬼，你加了crossOrigin="anonymous"是表明你想跨域获取这张图片，好用在canvas.toDataURL()上，但是服务端不一定同意啊，服务端添加了access...这个字段并且value是*或者你网站的域名才行，否则就认为你无权用，结果就是无法显示
参考：
http://stackoverflow.com/ques...
https://developer.mozilla.org...
https://developer.mozilla.org...
Like +0
Add Reply
刘奇
刘奇2017-04-11 12:36:53 1 floor

canvas无法对跨域的图片进行操作，楼主想要的裁剪保存功能如果在纯前端实现必须使用canvas。所以楼主必须要开启允许跨域，其中，除了服务端要允许当前页面允许跨域之外，楼主执行canvas操作前也要开启跨域。

var img=new Image();
img.crossOrigin="anonymous";
img.src='//';
ctx.drawImage(img, 0, 0, img.width, img.height);
Like +0
Add Reply
Popular Topics
More>
Popular Articles
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！