使用 html2canvas 生成图像，而不是从远程服务器导入图像

Question

我正在使用html2canvas lib从html代码生成png图像。html 结合了本地图像(来自图像文件夹(和远程图像(来自 url 地址 - 服务器(。图像看起来不错，但远程图像丢失。知道我该如何解决这个问题吗？

$('#save').click(function () {
var elm = $('.media_container_1200628').get(0);
var width = "1200";
var height = "628";
html2canvas(elm).then(function (canvas) {
Canvas2Image.saveAsPNG(canvas, width, height);
})
});

Answer 1

如文档中所述，您应该允许跨源图像污染画布。 https://html2canvas.hertzen.com/configuration

在特定情况下，您可以执行以下操作：

$('#save').click(function () {
var elm = $('.media_container_1200628').get(0);
var width = "1200";
var height = "628";
html2canvas(elm, { allowTaint: true }).then(function (canvas) {
Canvas2Image.saveAsPNG(canvas, width, height);
})
});