我正在使用HTML2Canvas来获取完整HTML页面的图像。我试图在单击按钮时将该图像保存在PPT中。
  我能够将图像保存在PPT中。
但是保存的图像内容越来越重叠,我在这里使用的警报大约需要1分钟才能显示。
当我进行调试时,我才知道问题出在HTML2Canvas。
我在网页中使用了许多第三方图表,例如Google图表。
能否请您建议我HTML2Canvas的任何替代方案,因为我看到当我们使用跨域内容时HTML2Canvas中几乎没有限制。

$('#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();
}
                           }
         });

}
});
                                                                    });

最佳答案

我有解决此问题的方法。
您可以尝试一下。

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


服务器是node.js的服务器URL或您可以编写的任何语言。

示例Node.js:https://github.com/niklasvh/html2canvas-proxy-nodejs

在此处阅读更多信息:Can't capture google map with html2canvas

和这里:Cross-origin image load denied by Cross-Origin Resource Sharing policy

关于javascript - 如何使用HTML2Canvas获取完整的HTML页面的屏幕截图,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/36264556/

10-11 14:03