后端返回图片信息是二进制流文件，前端vue如何解析

背景：

使用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()