这个都说是跨域问题,为什么第一次进到页面没错,在推出去再进就报这个错
Uncaught DOMException: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.
代码如下:
export const generateShareImg = (parms) => {
var mainCtx = getCanvasContext('main');
var maxWidth = mainCtx.width;
var maxHeight = mainCtx.height;
mainCtx.clearRect(0, 0, 1000, 1000);
var starBg = new Image();
starBg.src = parms.backimg;
var starImg = new Image();
starImg.src = parms.imgUrl;
var starImg1 = new Image();
starImg1.src = parms.wecode;
starImg.setAttribute('crossOrigin', 'anonymous');
starImg1.setAttribute('crossOrigin', 'anonymous');
starBg.onload = function() {
//先把图片绘制在这里
mainCtx.drawImage(starBg, 0, 0, 375, 600);
starImg.onload = function() {
// 头图
mainCtx.drawImage(starImg, 0, 0, 300, 300);
mainCtx.font = "small-caps bold 20px STXinwei";
//设置用户文本填充颜色
mainCtx.fillStyle = "#f53681";
//价格
mainCtx.fillText(parms.price, 10, 330);
// 标题
drawText(mainCtx, parms.title, 10, 330, 275, 'black');
drawText(mainCtx, parms.storeName, 160, 440, 170, '#f53681');
drawText(mainCtx, '微信中长按识别小程序码查看购买商品', 160, 470, 120, 'gray');
mainCtx.drawImage(starImg1, 10, 410, 140, 140);
convertCanvasToImage()
};
};
}
export const convertCanvasToImage = () => {
let canvas = document.getElementById('main');
var image = new Image();
//指定格式PNG
image.src = canvas.toDataURL("image/jpg");
image.onload = function(){
document.getElementById('qrcode-box').appendChild(image);
}
}