canvas生成图片toDataUrl报错

在使用canvas的toDataURL()方法时,控制台有时会报错

原因:这是由于之前由drawImage()向canvas导入的图片跨域而导致的。

解决办法

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

var myImage = new Image();
		myImage.setAttribute("crossOrigin", 'Anonymous'); //解决图片跨域问题
		myImage.src = imgUrl2; //背景图片  你自己本地的图片或者在线图片

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 *

你可能感兴趣的:(前端,javascript,前端)