Nov 7, 2024
0
Level 1
Cors Error in JS library HTML to Image
I have third party images embedded in my html but when i try to download the image i got the cors error and download the html in image form but with without image like blank html. I have attached the screenshot. Is there any possible solution??
link: https://prnt.sc/icgLVz2EZWYi
const downloadBtn = document.querySelector('#downloadBtn');
const downloadIcon = document.querySelector('#downloadIcon');
const loadingSpinner = document.querySelector('#loadingSpinner');
downloadBtn?.addEventListener('click', () => {
downloadIcon?.classList.add('d-none');
loadingSpinner?.classList.remove('d-none');
const div = document.querySelector('.result');
html2canvas(div, {
useCORS: true,
allowTaint: false,
logging: true,
}).then(canvas => {
const link = document.createElement('a');
link.href = canvas.toDataURL('image/jpeg');
link.download = 'image_screenshot.jpeg';
link.click();
}).catch(error => {
console.error('Error capturing the canvas:', error);
}).finally(() => {
downloadIcon?.classList.remove('d-none');
loadingSpinner?.classList.add('d-none');
});
});
});```
Please or to participate in this conversation.