canvas生成图片toDataURL报错的原因和解决方法

2021-07-11 13:07

阅读：675

标签：oss apach requested int src cut 使用 cto exce

现象：在使用canvas的toDataURL（）方法时，控制台有时会报错：Uncaught DOMException: Failed to execute ‘toDataURL‘ on ‘HTMLCanvasElement‘: Tainted canvases may not be exported.

原因：这是由于之前由drawImage（）向canvas导入的图片跨域而导致的。

解决方法：

1、在引用图片之前打开跨域资源允许权限（一定要注意顺序）：

1         var img=new Image;
2         img.crossOrigin="anonymous"; //关键4       
3         img.src="http://www.soscw.com/图片地址";

2、存放图片地址的服务器也要开启跨域允许权限，不然会报错：No ‘Access-Control-Allow-Origin‘ header is present on the requested resource.

如Apache设置：

①.打开LoadModule headers_module modules/mod_headers.so

②.在虚拟主机内加上 Header set Access-Control-Allow-Origin *

canvas生成图片toDataURL报错的原因和解决方法

标签：oss apach requested int src cut 使用 cto exce

原文地址：http://www.cnblogs.com/sunala/p/7085525.html

上一篇：js 在表单提交前进行操作

下一篇：js 四级联动

文章来自：搜素材网的编程语言模块，转载请注明文章出处。
文章标题：canvas生成图片toDataURL报错的原因和解决方法
文章链接：http://soscw.com/index.php/essay/103722.html

亲，登录后才可以留言！

canvas生成图片toDataURL报错的原因和解决方法

评论

热门文章

推荐文章

最新文章

置顶文章