Fabric.js Failed to execute ‘toDataURL’ on ‘HTMLCanvasElement’: Tainted canvases may not be exported.
问题
想导出fabric.js canvas的绘制信息,并设置背景图片,导出是出现文章标题描述的错误
代码
const imgObj = new Image()
imgObj.src = currentHit.data
canvas.width = imgObj.naturalWidth
canvas.height = imgObj.naturalHeight
fabric.Image.fromURL(currentHit.data, function (img) {
canvas.setBackgroundImage(img, canvas.renderAll.bind(canvas), {
width: canvas.width,
height: canvas.height,
});
}, {crossOrigin: 'anonymous'});
imgObj.setAttribute("crossOrigin",'Anonymous')
imgObj.onload = function () {
const a = document.createElement('a')
a.href = canvas.toDataURL('image/png') //将画布内的信息导出为png图片数据
a.download = 'tagger-img' //设定下载名称
a.click() //点击触发下载
resolve({
err: false,
msg: '',
})
}
imgObj.onerror = function () {
resolve({
err: true,
msg: "The image load error, maybe the reason is this image isn't saved in our service, can't produce local image",
})
}
})
}