背景:

使用axios请求接口,返回的打印返回的数据,浏览器控制台显示乱码,而在preview里查看却是一张图片。

这时候应该怎么处理?

放弃axios,使用XMLHttpRequest()

代码如下:

html部分:

<img :src="qrCodeSrc" />

 js部分:

let qrCodeUrl = '' // 要请求的接口地址          
let xhr = new XMLHttpRequest()
            xhr.open('GET', qrCodeUrl, true)
            xhr.responseType = 'blob' // 关键的一步
            xhr.setRequestHeader(
              'Authorization',
              window.sessionStorage.getItem('rearToken')
            ) // 设置token
            let that = this
            xhr.onreadystatechange = function() {
              if (xhr.readyState == 4) {
                if (xhr.status == 201) {
                  let blob = this.response
                  // 将blob转化为base64形式
                  let reader = new FileReader()
                  reader.readAsDataURL(blob)
                  reader.onloadend = function() {
                    let base64data = reader.result // 这里base64data就是请求到的图片的base64码
                    that.qrCodeSrc = base64data
                  }
                }
              }
            }
            xhr.send()

 

Logo

前往低代码交流专区

更多推荐