后台返回JFIF格式的图片乱码解析

因为国庆快要回老家了,心里有点着急,写代码的心都不知道飞哪了,然后碰到问题有点紧张. 今天对接口兴高采烈的对着,突然画风一转,结果如下图

然后一脸懵逼,这好像是二进制流,需要转换然后我就如下解析

axiosApi().then(res => {
        console.log(res)
        let blob = new Blob([res])
        let url = window.URL.createObjectURL(blob)
        this.licenseSrc = url
      })

发现居然不行,这该如何是好,上必应搜了一波,才知道要改变axios的响应类型responseType

  axiosApi: (enterpriseId) => {
   return request({
     url,
     method: 'get'
     responseType: 'arraybuffer'//加上这句就可以展示了
   })
 },

附：

//url转blob
const urlToBlob = the_url => {
 return new Promise(resolve => {
   let xhr = new XMLHttpRequest();
   xhr.open('get', the_url, true);
   xhr.responseType = 'blob';
   xhr.onload = function () {
     if (this.status == 200) {
       resolve(this.response);
     }
   };
   xhr.send();
 });
};
//base64转blob
const convertBase64ToBlob = (base64, fileType, slice) => {
 return new Blob(
   atob(base64)
     .match(new RegExp(`([\\s\\S]{${slice}})|([\\s\\S]{1,${slice}})`, 'g'))
     .map(function (item) {
       return new Uint8Array(
         item.split('').map(function (s, i) {
           return item.charCodeAt(i);
         })
       );
     }),
   { type: fileType }
 );
};

希望文章能有所帮助,解释不到位的地方欢迎评论