Al descargar la imagen, la API de código QR de Google está en blanco. Cuando uso una imagen diferente en lugar de la API de código QR de Google, se incluye.
''' <!-- div to be generated --> <div id="qrid"> <h1>Sample ID</h1> <img src="https://chart.googleapis.com/chart?chs=300x300&cht=qr&chl=http%3A%2F%2Fwww.google.com%2F&choe=UTF-8"> </div> <button onclick="downloadDiv('qrid')">Print as Image</button> <!-- import jquery and html2canvas --> <script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script> <script src="html2canvas.js"></script> <script src="html2canvas.min.js"></script> <script type="text/javascript"> function downloadDiv(divid) { html2canvas(document.getElementById(divid)).then(function (canvas) { $("#previewImg").append(canvas); var anchorTag = document.createElement("a"); document.body.appendChild(anchorTag); // document.getElementById(divid+"2").appendChild(canvas); anchorTag.download = "Visitor_"+divid+".png"; anchorTag.href = canvas.toDataURL(); anchorTag.target = '_blank'; anchorTag.click(); }); } </script> '''Debe habilitar las opciones allowTain como sigue y asegurarse de que el encabezado Access-Control-Allow-Origin esté habilitado para su sitio
function downloadDiv(divid) { html2canvas(document.getElementById(divid), {allowTaint : true}).then(function (canvas) { $("#previewImg").append(canvas); var anchorTag = document.createElement("a"); document.body.appendChild(anchorTag); // document.getElementById(divid+"2").appendChild(canvas); anchorTag.download = "Visitor_"+divid+".png"; anchorTag.href = canvas.toDataURL(); anchorTag.target = '_blank'; anchorTag.click(); }); }