axios请求类型是文件流怎么显示报错信息

axios请求类型是文件流,但是报错信息的话没法显示,在request.js文件中更改一下request拦截器代码:

service.interceptors.request.use(config => {

......

, error => {

console.log(error, '报错报错')

// 处理请求错误

if (error.response && error.response.data instanceof Blob && error.response.data.type === 'application/json') {

// 如果错误信息是一个 JSON 格式的 Blob,那么读取 Blob 的内容并解析为 JSON 对象

return error.response.data.text().then(text => {

const json = JSON.parse(text);

console.log(json);

// 返回一个包含错误信息的 Promise 对象

return Promise.reject(json);

});

}

// 如果错误信息不是一个 JSON 格式的 Blob,那么返回原始的错误对象

return Promise.reject(error);

// Promise.reject(error)

})

更改响应拦截器:

service.interceptors.response.use(res => {

if (res.data) {

// 判断Bolb类型是否有错误信息 错误信息的话直接弹窗提示

if (

res.data instanceof Blob &&

res.data.type === 'application/json'

) {

let reader = new FileReader()

reader.readAsText(res.data, 'utf-8')

reader.onload = function (e) {

let data = JSON.parse(e.target.result)

if (data.code !== 200) {

MessageBox.confirm(data.data, '文件生成失败', {

confirmButtonText: '确定',

cancelButtonText: '取消',

type: 'error'

}).then(() => {

})

}

}

return Promise.resolve(res)

}

}

// 二进制数据则直接返回

if (res.request.responseType === 'blob' || res.request.responseType === 'arraybuffer') {

return res.data

}

......

})

完工!

相关推荐
好好好明天会更好4 分钟前
vue中的this.$nextTick如何使用
前端·vue.js
我的div丢了肿么办6 分钟前
使用URLSearchParams 优雅的获取URL携带的参数
前端·javascript
XXXFIRE6 分钟前
微信小程序开发实战笔记:全流程梳理
前端·微信小程序
答案answer9 分钟前
回顾一下我的开源项目之路和Three.js 学习历程
前端·开源·three.js
ZoeLandia9 分钟前
nginx实战分析
运维·前端·nginx
张迅之啊9 分钟前
【React】MQTT + useEventBus 实现MQTT长连接以及消息分发
前端
入秋12 分钟前
【视觉震撼】我用Three.js让极光在网页里跳舞!
前端·three.js
盛夏绽放13 分钟前
Vue项目生产环境性能优化实战指南
前端·vue.js·性能优化
专注API从业者21 分钟前
Python/Node.js 调用taobao API:构建实时商品详情数据采集服务
大数据·前端·数据库·node.js
狂炫一碗大米饭40 分钟前
Vue 3 的最佳开源分页库
前端·程序员·设计