html2canvas 导出带有滚动条的截屏和图表，出现空白现象

[cklwblove]

import html2canvas from "html2canvas";
import FileSaver from 'file-saver';

function downloadResult(name) {
    const app = document.querySelector("#app");
    const width = app.scrollWidth
    const height = app.scrollHeight
    html2canvas(app, {
	  width: width,
	  height: height,
	  allowTaint: false,
	  useCORS: true,
	  windowHeight: height * 2, // 获取y方向滚动条中的内容
    }).then(canvas => {
	  const dom = document.body.appendChild(canvas);
	  dom.style.display = "none";
	  const fileBlob = dataURLToBlob(dom.toDataURL("image/png").replace("image/png", "image/octet-stream"));
          const fileName = 'demo.png';
	  
	  FileSaver.saveAs(fileBlob, fileName);

          document.body.removeChild(dom);
    });
}

/**
 * base64转blob
 *
 * @param {string} dataURL
 * @returns {*}
 * @example
 *
 * const URI = 'data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMTAyNCAxMDI0IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMDAiIGhlaWdodD0iMjAwIj48ZGVmcz48c3R5bGUvPjwvZGVmcz48cGF0aCBkPSJNOTU5LjQzNiAyNDMuNUwzNzcuNDEzIDg3MC4yNyA2NC4wMiA0NjcuMzQ0bDExNC43MjctOTcuOTMgMTk4LjY2NiAyMDcuMDYgNDkyLjQ4Mi00MjIuNTEgODkuNTQgODkuNTM3em0wIDAiIGZpbGw9IiM0M2E5ZjEiLz48L3N2Zz4=';
 *
 * dataURLToBlob(URI);
 * // => Blob {size: 248, type: "image/svg+xml"}
 */
function dataURLToBlob(dataURL) {
  var BASE64_MARKER = ';base64,';
  var parts;
  var contentType;
  var raw;

  if (dataURL.indexOf(BASE64_MARKER) === -1) {
    parts = dataURL.split(',');
    contentType = parts[0].split(':')[1];
    raw = decodeURIComponent(parts[1]);

    return new Blob([raw], {type: contentType});
  }

  parts = dataURL.split(BASE64_MARKER);
  contentType = parts[0].split(':')[1];
  raw = window.atob(parts[1]);
  var rawLength = raw.length;
  var uInt8Array = new Uint8Array(rawLength);

  for (var i = 0; i < rawLength; ++i) {
    uInt8Array[i] = raw.charCodeAt(i);
  }

  return new Blob([uInt8Array], {type: contentType});
}