后端返回文件流
一、接口书写二、axios接口封装如下:// 响应拦截器 service.interceptors.response.use(async res { // console.log(响应拦截器, res); // 未设置状态码则默认成功状态 // 0是成功,其他都是失败 const code res.data.code const customKey res.config.headers.custom500Msg; // 获取错误信息 const msg errorCode[customKey] || errorCode[code] || res.data.msg || errorCode[default] // 二进制数据则直接返回 // if (res.request.responseType blob || res.request.responseType arraybuffer) { // return res.data // } if (res.request.responseType blob || res.request.responseType arraybuffer) { // 读取blob里的文本内容 const text await res.data.text() console.log(text, text); try { const json JSON.parse(text) // 能解析出业务错误弹窗报错 if (json.code ! 200) { ElNotification.error(json.msg || 请求失败) return Promise.reject(json) } } catch (err) { // 解析失败正常文件流直接返回blob return res.config.returnRes ? res : res.data } // 解析成功但无错误返回blob return res.config.returnRes ? res : res.data } if (code ! 0) { //code 401 登录报错 ElNotification.error({ title: msg }) return Promise.reject(error) } else { // 成功 code0 return Promise.resolve(res.data) } }, error { console.log(进入错误拦截器 error) if (error.response?.status 401) { console.log(HTTP 401 登录过期, !isRelogin.show); handle401(); return Promise.reject(登录已过期); } let { message } error if (message Network Error) { message 后端接口连接异常 } else if (message.includes(timeout)) { message 系统接口请求超时 } else if (message.includes(Request failed with status code)) { message 系统接口 message.substr(message.length - 3) 异常 } ElMessage({ message: message, type: error, duration: 5 * 1000 }) return Promise.reject(error) } )
