将URL图片链接转换成base64

在使用html2canvas截图的时候，canvas重新渲染的时候 ，如果资源是URL图片的时候，在请求有个延时可能还没渲染完就完成绘制了，造成图片截图不出来。 这时将URL图片转换成base64后，用base64渲染img图片，这样就可以完美解决问题 如何将“跨域图片”转换成base64呢？原理很简单，将img绘制成canvas，再将canvas转换成base64的img流。 具体代码

const base64 = getBase64Image('http://wwww.test/test.png', 'coopCachetImg')
// 第一个参数是图片的URL地址，第二个是转换成base64地址后要赋值给的img标签
getBase64Image (url, ref) {
    var image = new Image()
    image.src = url + '?v=' + Math.random() // 处理缓存
    image.crossOrigin = '*' // 支持跨域图片
    image.onload = () => {
        var base64 = drawBase64Image(image)
        this.$refs[ref].src = base64
    }
},
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
}