htmlcanvas2 传入节点生成图片

/**

• htmlcanvas2 传入节点生成图片
  */
  canvas canvas.toDataURL 图片太大会导致保存失败，解析出来的超出了浏览器对于url的限制 故使用canvas.toBlob

import html2canvas from 'html2canvas';
/**
 * htmlcanvas2  传入节点生成图片
 * @param {*} node 节点
 */
export function captureScreen(node) {
    // 调用html2canvas插件
    html2canvas(node, {
        allowTaint: false,
        foreignObjectRendering: true,
        taintTest: false,
        useCORS: true,//火狐浏览器添加项
    }).then(canvas => {
        var image = canvas.toDataURL("image/png").replace("image/png", "image/octet-stream");
        var userAgent = navigator.userAgent;
        //判断是否是IE11
        if (-1 !== userAgent.indexOf("Trident")) {
            var arr = image.split(',');
            var mime = arr[0].match(/: (.*?);/)[1];
            var bstr = atob(arr[1]);
            var n = bstr.length;
            var u8arr = new Uint8Array(n);
            while (n--) {
                u8arr[n] = bstr.charCodeAt(n);
            }
            window.navigator.msSaveBlob(new Blob([u8arr], { type: mime }), "download.png");
        } else {
            canvas.toBlob(function (blob) {
                const eleLink = document.createElement('a');
                eleLink.download = "img.png";
                eleLink.style.display = 'none';
                // 字符内容转变成blob地址
                eleLink.href = URL.createObjectURL(blob);
                // 触发点击
                document.body.appendChild(eleLink);
                eleLink.click();
                // 然后移除
                document.body.removeChild(eleLink);
            }, 'image/png', 1);
        }
    })
}