接收后端返回的二进制流文件

先上代码：（params是我传给后端的数据，如果你不传值，可以忽略不计）

  let params1 = {
      uri : this.projectIconSend
  }
  this.$axios({
      url: this.$api.newProjectShow,
      method: 'get', 
      params:params1,
      responseType: 'blob',    // 返回类型blob                     
  }).then( (res) => {
     let src = window.URL.createObjectURL(res)//转换为图片路径
     this.verifyImg = src;
  })

后端返给前端的二进制文件

如果在前端打印的话，是一串乱码；

 

页面展示

responseType: 'blob',    // 返回类型blob 这个是设置后端返回的数据类型

• http请求有个responseType， 用来设置返回值，默认是'',等同于text，数据格式的转换是浏览器处理的
• 我们还会用到json,buffer,blob
• json:是我们经常遇到后端返回的数据格式，直接res.json就可以
• blob,当后端返回一个文件流时候回用到，
• ArrayBuffer涉及面比较广，我的理解是ArrayBuffer代表内存之中的一段二进制数据，一旦生成不能再改。可以通过视图（TypedArray和DataView）进行操作。
• Blob也是比较有意思，mdn上的解释是Blob对象表示不可变的类似文件对象的原始数据。Blob表示不一定是JavaScript原生形式的数据。
• URL.createObjectURL() 静态方法会创建一个 DOMString，其中包含一个表示参数中给出的对象的URL。这个 URL 的生命周期和创建它的窗口中的 document 绑定。这个新的URL 对象表示指定的 File 对象或 Blob 对象。
• 一个DOMString包含了一个对象URL，该URL可用于指定源 object的内容。

这里我们用到的是blob;