h5截屏 html2canvas截图

　
 getBase64Image = (url, callback, outputFormat) => {
    var canvas = document.createElement(‘CANVAS‘),
      ctx = canvas.getContext(‘2d‘),
      img = new Image();
    img.crossOrigin = ‘‘;
    img.onload = (res) => {
      canvas.height = img.height;
      canvas.width = img.width;
      ctx.drawImage(img, 0, 0);
      var dataURL = canvas.toDataURL(outputFormat || ‘image/png‘);
      this.setState({
        img: dataURL,
      }, () => {
        this.createPicture();
      })
      canvas = null;
    };
    img.src = `${url}?timeStamp=${+new Date()}`;
  }

  createPicture = () => {
    const scale = this.getPixelRatio();
    // 获取要转换的元素
    html2canvas(this.imgRef.current, {
      scale: scale,
      useCORS: true, // 开启跨域设置，需要后台设置cors
    }).then((canvas) => {
      // toDataURL函数生成img标签的可用数据  图片格式转成 base64
      let dataURL = canvas.toDataURL("image/png");
      this.setState({
        share_image: dataURL,
        canvasImgOnLoad: true,
      });
    });
  };