Angular 6 dom-to-image 抛出未捕获的错误（无法将 html 转换为图像）

Question

我想将 html 部分转换成图像（注意 Html 部分有许多来自服务器的其他图像）我正在使用 angular 6 和 node.js 以及将 html 转换为图像的库 dom-to-img

It is working in localhost But when I test it into Production level it gives me error That is in picture

这里是 HTML 我想转换成图像的区域，其中来自服务器的签名和背景蓝色为 URL

我使用 @ViewChild('checkContainer') 容器； 得到 dom(Html 部分) 参考然后我调用一个函数，它给我一个图像类型文件，然后我传递给将这个图像保存在数据库中的服务器。 一切都在 Localhost 中工作，但不在生产中

Here is the code I have tried.

async convertToImage(fileName) {
try {
  const blob = await domtoimage.toBlob(this.container.nativeElement);
   this.checkImageFile = new File([blob], fileName + '.png', {
     type: 'image/png'
   }); // image File
} catch (error) {
  console.log('ops error', error);
}

}

及以上函数将从该函数调用 checkImageFile 是属性在我的文件中声明的名称。

async addCheck() {
const fileName = this.checkModel.checkNumber;
await this.convertToImage(fileName);
if (this.checkImageFile) {
  console.log(this.checkImageFile);
} else {
  console.log('dom to image is not working properly');
}

}

我的代码中缺少什么？你能帮我么？谢谢你们编码愉快。:)

Answer 1

此包存在兼容性问题，您可以使用以下包代替 dom-to-image-more

Angular 6 dom-to-image 抛出未捕获的错误（无法将 html 转换为图像）

Angular 6 dom-to-image throws uncaught error (Can't convert html to image)

javascript

image

wkhtmltoimage

angular