HTML2Canvas kullanmadan tam HTML sayfasının ekran görüntüsünü nasıl alırsınız?

Question

Tam HTML sayfasının görüntüsünü almak için HTML2Canvas kullanıyorum. Bu görüntüyü tek tıklamayla PPT'ye kaydetmeye çalışıyorum. Görüntüyü PPT'ye kaydedebiliyorum. Ancak kaydedilen görüntü içeriği çakışıyor ve burada kullandığım uyarı gösterilecek yaklaşık 1 dakika alıyor. hata ayıkladığımda, sorunun HTML2Canvas ile olduğunu bilmem gerekiyor. Sayfamda Google grafikler gibi birçok üçüncü taraf grafiğini kullandım. bana, çapraz kaynaklı içerik kullandığımızda HTML2Canvas'ta birkaç sınırlama olduğunu gördüğüm için HTML2Canvas için herhangi bir alternatif önerebilirsiniz.

$('#PPTExport').click(function(e) { 


var canvas = document.getElementById('canvas'); 
var target = $('#loadImageHeader'); 
     html2canvas(target, { 
     onrendered: function(canvas) { 

     var data1 = canvas.toDataURL("image/jpeg").replace("image/jpeg", "image/octet-stream"); 

     alert(data1); 




$.ajax({ 
url: "savechart", 
data:{ 
image1:data1 
     }, 

type: 'POST', 
success: function (data) { 
if(data=="success") 
{ 

$("#formid1").attr('action','savechartDownload'); 
$("#formid1").submit(); 
} 
          } 
     }); 

} 
}); 
                    }); 

Answer 1

Bu sorun için çözümüm var. Sen

html2canvas([document.body], { 
     useCORS: true, 
     proxy: "Server", 
     onrendered : function(canvas) {        
      var myImage = canvas.toDataURL("image/png"); 
      window.open(myImage); 
     } 
}); 

Sunucu

node.js ya yazabilir herhangi bir dilin sunucu url olduğunu .. bu deneyebilirsiniz.

Örnek node.js: https://github.com/niklasvh/html2canvas-proxy-nodejs

burada daha fazla okuyun: Can't capture google map with html2canvas

ve Burada: Hızlı cevap için Cross-origin image load denied by Cross-Origin Resource Sharing policy