htmcanvas2生成png因链接图片跨域错误处理

52 阅读1分钟

image.png

   getImage() {
            let url = this.dataList.cover // 真实的地址
            let imgId = 'shareImg'   // 真实的图片元素
            var xhr = new XMLHttpRequest()
            xhr.open('get', url, true)
            // 设置请求头(这一步得设置不然oss图片还是跨域)
            xhr.setRequestHeader('Cache-Control', 'no-cache')
            xhr.responseType = 'blob'
            xhr.onload = function () {
              console.log(2, this.status)
              if (this.status == 200) {
                document.getElementById(imgId).src = URL.createObjectURL(this.response)
                console.log('this.response', this.response)
              }
            }
            xhr.send()
          },

点击生成前把url图转换为本地blob:xx临时地址的格式,注意后台也要对应修改 阿里云示范 developer.aliyun.com/article/116…