基于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.需要在服务器端运行,才可以正常使用

原博

猜你喜欢

转载自blog.csdn.net/dxj124/article/details/84550070