canvas 图片跨域问题

最近在做功能的时候，遇到一个问题，用canvas合成图片做展示，本地的图片都没问题，从第三方倒过来的图一直在报跨域的错误，本姑娘真的尝试了各种方法，比如设置crossOrigin， 加随机数，在服务器添加跨域头等等，无奈问题一直没有得到解决，当然，crossOrigin和随机数是要加的，不然在图片toDataUrl的时候也会报错，但是一直没有解决我的问题

最后跟后台开发商量之后得出解决方案，把第三方图片通过php处理，然后直接输出图片，就可以使用，需要注意的是在请求后台的时候需要用encodeURIComponent转码，不然碰到图片链接里带%号的就呵呵了

处理代码如下

let url = encodeURIComponent('图片地址.jpg')

this.toDataURL(`后台接口地址.php?url=${url}`, function(dataUrl) {

      self.dataUrl = dataUrl

 })

toDataURL(src, callback, outputFormat) {

      var img = new Image()

      img.crossOrigin = 'Anonymous'

      img.src = src + '&timeStamp=' + new Date()

      img.onload = function() {

        var canvas = document.createElement('CANVAS')

        var ctx = canvas.getContext('2d')

        var dataURL

        canvas.height = this.naturalHeight

        canvas.width = this.naturalWidth

        ctx.drawImage(this, 0, 0)

        dataURL = canvas.toDataURL(outputFormat)

        callback(dataURL)

      }

      // 图片加载错误

      img.onerror = function(e) {

        console.log('错误', e)

      }

      if (img.complete || img.complete === undefined) {

        img.src = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw=='

        img.src = src

      }

}

toDataURL里的操作可以按照自己的需求来写，反正把你受到跨域限制的那张图片名称.jpg换成跟后台协商好的地址就行，之后就可以愉快的玩耍了

如果大神们有其他解决办法，跪求告知！！！！！！！！！