标签：getc uri img script var 网上 inf anon ros
我们做微信活动，经常会碰到生成图片进行分享的需求。生成的图片中肯定包含微信头像，这时就会碰到canvas转图片时的跨域问题。
一开始我是把微信头像下载到服务器上来避开跨域问题的，但这样做太累了，也浪费服务器存储空间。
之后再网上搜索后得到如下解法
var img = new Image();
img.src = userInfo.headimgurl;//微信头像地址
img.setAttribute(‘crossOrigin‘, ‘anonymous‘); // 重点
img.onload=function(){
var canvas = document.createElement("canvas");
canvas.width = 150;//这个设置不能丢，否者会成为canvas默认的300*150的大小
canvas.height = 150;//这个设置不能丢，否者会成为canvas默认的300*150的大小
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0, 150, 150);
var dataURL = canvas.toDataURL("image/png");
$("img").attr("src", dataURL);
}
咋一测试，是ok的。后面发现经常会报Tainted canvases may not be exported.错误
于是重新开始搜索，大概是浏览器缓存和cdn的问题，具体原因就不详解了。
最终给微信头像链接加上随机数参数后缀就解决了
img.src = userInfo.headimgurl + "?v=" + new Date().getTime();//微信头像地址
canvas跨域图片报Tainted canvases may not be exported.解决办法
标签：getc uri img script var 网上 inf anon ros
原文地址：https://www.cnblogs.com/rooney-10/p/9959205.html
