美文网首页
Tainted canvases may not be expo

Tainted canvases may not be expo

作者: Littlehey | 来源:发表于2018-11-26 14:52 被阅读0次

    项目里使用到用canvas生成海报,在toDataURL报了这个错误Tainted canvases may not be exported。
    原因就在于使用了跨域的图片,所以说是被污染的画布。
    解决方案如下
    1】为image请求添加跨域

    var image = new Image()
    image.setAttribute("crossOrigin",'Anonymous')
    image.src = src
    

    但也许有可能服务器不让你跨域请求图片(也不知道为啥),那么用到方案2
    2】通过把请求的图片转化成base64再进行使用
    代码如下

    function getURLBase64(url) {
      return new Promise((resolve, reject) => {
        var xhr = new XMLHttpRequest()
        xhr.open('get', url, true)
        xhr.responseType = 'blob'
        xhr.onload = function() {
          if (this.status === 200) {
            var blob = this.response
            var fileReader = new FileReader()
            fileReader.onloadend = function(e) {
              var result = e.target.result
              resolve(result)
            }
            fileReader.readAsDataURL(blob)
          }
        }
        xhr.onerror = function() {
          reject()
        }
        xhr.send()
      })
    }
    

    相关文章

      网友评论

          本文标题:Tainted canvases may not be expo

          本文链接:https://www.haomeiwen.com/subject/bqrbqqtx.html