html2canvas 图片cors错误解决方案(图片无法保存)

今天掉进了坑里，图片怎么都保存不下来，最终解决了，特此记录下

<img src="xxx.jpg"alt=""  crossOrigin="anonymous"/>

html2canvas(this.$refs.orderReceipt, {
    logging: true,
    useCORS: true,
    allowTaint: false,
    backgroundColor: null,
}).then((canvas) => {
    let imgUrl = canvas.toDataURL('image/jpeg', 1);
    // 创建一个隐藏的可下载链接
    var downloadLink = document.createElement('a');
    downloadLink.href = imgUrl; // 将base64字符串赋值给href
    downloadLink.download = 'xxx.jpg'; // 设置下载的文件名
    // 隐藏链接
    downloadLink.style.display = 'none';
    document.body.appendChild(downloadLink);
    // 触发点击
    downloadLink.click();
    // 然后移除
    document.body.removeChild(downloadLink);
});

使用时，有两个核心点

1. img图片必须加crossOrigin="anonymous"
2. html2canvas，参数中，必须使用useCORS: true

今天出问题，就在第一点，特此记录一下