“Tainted canvases may not be exported” issue still present after setting cross-origin on S3 bucket

问题

The code below should convert html to pdf using html2canvas library and then download it, but it's showing this error:

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

The issue is still present after allowing cross-origin on the S3 bucket.

    html2canvas(document.getElementById('compare'), {
            scale: window.devicePixelRatio,
            logging: true,
            allowTaint:true,
            onrendered: function (canvas) {
                var data = canvas.toDataURL();
                var docDefinition = {
                    content: [{
                        image: data,
                        width: 500,
                    }]
                };
                //window.open().document.write('<img src="'+data+'"/>');
                setTimeout(function () {
                    ele[0].style.display = 'flex';
                    ele[1].style.display = 'flex';
                    if (ele1.length > 0) {
                        ele1[0].style.display = 'block';
                    }
                }, 300);
               pdfMake.createPdf(docDefinition).download("compare.pdf");
            }
        });

回答1:

Try to add crossOrigin attribute to the image:

<img src="path/to/s3.jpg" crossorigin>

来源：https://stackoverflow.com/questions/58918263/tainted-canvases-may-not-be-exported-issue-still-present-after-setting-cross-o