解决 html2canvas 转图片时不显示网络图片的问题

业务场景：需要将div元素转成一张图片，div元素里面包含img标签，加载一张网络图片。

问题：正常转换成图片的话，网络图片显示不出来，其余元素都能按样式正常显示，后来经测试如果加载本地图片，也能正常显示，于是就想办法将网络图片变成本地图片（base64二进制）。

解决方案：网络图片变成本地图片（base64二进制）

//将网络图片转成本地图片
function getBase64Image(url) {
    var image = new Image()
    image.src = url + '&v=' + Math.random() // 处理缓存
    image.crossOrigin = '*' // 支持跨域图片
    image.onload = function () {
        $(".invit_info_qrcode").attr("src",drawBase64Image(image))
        convertDivToImage("my_div")
    }
}

//将图片转成base64，返回字符串
function drawBase64Image(img) {
    var canvas = document.createElement('canvas')
    canvas.width = img.width
    canvas.height = img.height
    var ctx = canvas.getContext('2d')
    ctx.drawImage(img, 0, 0, img.width, img.height)
    var dataURL = canvas.toDataURL('image/png')
    return dataURL
}

//转换图片，传入元素id
function convertDivToImage(divId) {
    const $element = $('#' + divId);
    $element.css('background-color', '#fff')
    html2canvas($element[0]).then((canvas) => {
        const imgData = canvas.toDataURL('image/png');
        const imgEle = $('#review').attr('src', imgData).attr('width',    canvas.width).attr('height', canvas.height);
        $element.replaceWith(imgEle);
    });
}

贴出核心代码，自己研究吧