I want to convert html section into image(Note Html section has many other images from server) I am using angular 6 and node.js and library for converting html to image is dom-to-img
It is working in localhost But when I test it into Production level it gives me error That is in picture
Here is HTML Area that I want to convert into an image in which signature and back blue color coming from the server as URL
i used @ViewChild('checkContainer') container; to get dom(Html section) reference and then i'm calling a function that gives me an image type file and I pass to the server that saves this image in Database. All is working in Localhost but not in production
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);
}
}
and above function will call from this function checkImageFile is property name that is declared in my file.
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');
}
}
What is missing in my code? can you please help me? Thank you all Happy Coding.:)
It is a compatibility issue with this package you can use the following package instead dom-to-image-more