(vue)前端区分接口返回两种格式，一种Blob二进制字节流，一种常规JSON，且将blob响应转为json

(vue)前端区分接口返回两种格式，一种Blob二进制字节流，一种常规JSON，且将blob响应转为json

需求：导出功能接口返回两种格式，二进制直接下载，json需弹窗提示

• 格式1：
  

• 格式2：
  

思路：1.先区分是哪种格式 2.将需要提示的数据转为json

实现：

// 将blob转为json（重点2）
async blobToJson(blob) {
  const text = await blob.text()
  console.log(text) // 第118行
  return JSON.parse(text)
},
// 导出
exportHandle() { 
  exportVariance(this.formData).then(async(res) => {
    if (res.type.includes('application/json')) {（重点1）
      const jsonData = await this.blobToJson(res) 
      console.log(jsonData) // 第126行
      this.$message.warning(jsonData.message)
    } else {
      const data = res
      const url = window.URL.createObjectURL(new Blob([data], { type: 'text/csv;charset=utf-8;' }))
      const link = document.createElement('a')
      link.href = url
      link.setAttribute('download', 'export.csv')
      link.click() 
    } 
  }).catch((res) => {
    console.log(res) 
  })
},

打印：

效果：