基于html2canvas实现网页保存为图片为缩略图

关于canvas

 

场景：微信长按网页保存为截图。

 

步骤：

1.引入html2canvas.js  可以在github上下载

http://html2canvas.hertzen.com/

2.代码

var cntElem = $("#filesEnd")[0];
 var opts = {
        scale: scale, // 添加的scale 参数
        canvas: canvas, //自定义 canvas
        // logging: true, //日志开关，便于查看html2canvas的内部执行流程
        width: width, //dom 原始宽度
        height: height,
        useCORS: true // 【重要】开启跨域配置
    
};


html2canvas(shareContent, opts).then(function (canvas) {

      var htmlpic = canvas.toDataURL("image/jpeg",0.5);
       $("#thumbnailImg").attr('src',htmlpic);

  });

注意：canvas.toDataURL.需要在服务器端运行,才可以正常使用

原博