html2canvas随笔

html2canvas使用时遇到的一些问题 （html2canvas": "^1.0.0-rc.1"）

生成的图片模糊，参考网上的处理图片模糊方法(scale放大2倍)结果发现生成的图片只显示了部分dom； 

let _canvas = document.getElementById("poster"),//需要截图的包裹的（原生的）DOM 对象
          width = _canvas.clientWidth,//shareContent.offsetWidth; //获取dom 宽度
          height = _canvas.clientHeight,//shareContent.offsetHeight; //获取dom 高度
          canvas = document.createElement("canvas"), //创建一个canvas节点
          scale = 2; //定义任意放大倍数 支持小数   （将canvas放大2倍）
      canvas.width = width * scale; //定义canvas 宽度 * 缩放
      canvas.height = height * scale; //定义canvas高度 *缩放
      canvas.style.width = _canvas.clientWidth * scale + "px";
      canvas.style.height = _canvas.clientHeight * scale + "px";
      canvas.getContext("2d").scale(scale, scale); //获取context,设置scale
      let opts = {
          scale: 1, // 添加的scale 参数(将导出的图片放大比例设为1)
          canvas: canvas, //自定义 canvas
          logging: false, //日志开关，便于查看html2canvas的内部执行流程
           width, //dom 原始宽度
          height: height,
          useCORS: true // 【重要】开启跨域配置
      };

      html2canvas(document.getElementById("poster"), opts).then((canvas) => {
        this.img = canvas.toDataURL('image/jpeg', 1);
      });

参考 https://github.com/niklasvh/html2canvas/issues/2227#issuecomment-627293784