Javascript 使用CSS背景图像时，可能无法导出受污染的画布

我正在使用html2canvas从一组HTML元素生成一个图像。但是，其中一个元素有一个

背景图像

属性，该属性包含从不同来源加载的图像。这会导致画布在生成时受到污染，导致图像生成失败，并出现以下错误

DOMException: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.

尝试在返回的画布上调用

toDataUrl（）

时

图像的

Access Control Allow Origin

标题设置为

*

，因此我觉得它应该可以工作，但是错误当然不会给我太多的信息

---

关于使用

image.crossOrigin='anonymous'

将不同来源的图像加载到画布中有很多问题，但是没有人提到使用CSS将图像加载为背景图像，所以我想知道如何处理这个问题？

不知道这是否仍然是一个问题，但我对生成的CSS背景图像也有同样的问题我也犯了同样的错误

---

用

useCORS:true

修复了它。除此之外，为选项

allowTaint

设置默认值也很重要，该选项为

false

测试您的图像是否真正通过了CORS：当您直接在空画布上（而不是作为背景）绘制图像时，是否能够使用

toDataURL

？另外，您是否已将html2canvas设置为true？如果问题仍然存在，html2canvas可能不会检查背景图像，您可能需要在div下分层img，而不是使用背景图像。