将URL图片链接转换成base64

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

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