导出文件时,responseType设置为'arraybuffer',如果导出出错,后台返回错误信息应该怎么办?

1、正常导出的情况:(使用axios发送请求)后端返回二进制文件

api文件

 async download(params) {
  return await  $axios.$post(`url`,params,{ responseType: 'arraybuffer'})
  },

调用api

let formData = new FormData();

formData.append('file',file);//传文件

this.$api.download(formData).then(res=>{
 
const data = new Blob([res],{type:'application/vnd.ms-excel'})
 
const url = URL.createObjectURL(data)
 
const a = document.createElement('a')
 
a.href = url
 
a.download = 'table.xls'
 
a.click()
// 释放这个临时的对象objectUrl
URL.revokeObjectURL(url)
 
}

2、如果数据量过多则后端返回错误信息

由于请求的时候设置了responseType:’arraybuffer’,返回的是数据流,要取得json信息需要进行转换:

let enc = new TextDecoder('utf-8')
let data = JSON.parse(enc.decode(new Uint8Array(res.data)))

错误提示为:(此处简化了)

$axios.onError(error => {
  let enc = new TextDecoder('utf-8')
  let blob = JSON.parse(enc.decode(new Uint8Array(error.response.data)))
  Vue.prototype.$message.error(blob.data);
})

ok,到这里为止就解决问题了。

版权声明:除特别注明外,本站所有文章均为田珊珊个人博客原创

转载请注明:出处来自田珊珊个人博客 » 导出文件时,responseType设置为’arraybuffer’,如果导出出错,后台返回错误信息应该怎么办?

点赞

发表评论

电子邮件地址不会被公开。 必填项已用*标注