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

}

......

})

完工!

相关推荐
前端小书生7 分钟前
React 组件渲染
前端·react.js
奔跑的蜗牛ing11 分钟前
Vue3 + Element Plus 输入框省略号插件:零侵入式全局解决方案
vue.js·typescript·前端工程化
sjd_积跬步至千里13 分钟前
CSS实现文字横向无限滚动效果
前端
维他AD钙14 分钟前
前端基础避坑:3 个实用知识点的简单用法
前端
journs16 分钟前
micro-app微前端styled-components CSSOM模式 应用切换样式丢失问题
前端
呼啦啦小魔仙16 分钟前
elpis项目DSL设计分享
前端
李李记17 分钟前
别让 “断字” 毁了 Canvas 界面!splitByGrapheme 轻松搞定非拉丁文本换行
前端·canvas
来金德瑞17 分钟前
快速掌握 ProseMirror 的核心概念
前端
ygria22 分钟前
样式工程化:如何实现Design System
前端·前端框架·前端工程化
墨渊君2 小时前
“蒙”出花样!用 CSS Mask 实现丝滑视觉魔法
前端·css