返回流类型接口的错误信息处理

devtools/2024/11/25 0:54:14/

返回流类型接口的错误信息处理

    • 前言
    • axios拦截器src/utils/request.ts
    • 对应接口

前言

返回流类型接口需要在响应成功回调里拦截,且该接口的status始终是200,尽管后端返回的code可能是非2xx,因此返回流类型的接口,其错误信息需要单独处理。

axios拦截器src/utils/request.ts

import axios, { type AxiosResponse } from 'axios'
import { ElMessage } from 'element-plus'
import Nprogress from 'nprogress'
import 'nprogress/nprogress.css'
import { getToken } from '@/utils/token'
import router from '@/router/index'
import { environment } from '@/evn.config'const service = axios.create({baseURL: environment.VITE_APP_BASE_URL.includes('http')? environment.VITE_APP_BASE_URL: window.location.origin,
})// 不需要token
const whiteList = ['/auth/oauth/token', '/register']service.interceptors.request.use((config) => {Nprogress.start()const unneededToken = whiteList.includes(config.url as string)if (!unneededToken) {const token = getToken()if (token && Object.getOwnPropertyNames(token).length) {// eslint-disable-next-line no-param-reassignconfig.headers.Authorization = `Bearer ${token.access_token}`}}return config},(err) => Promise.reject(err)
)service.interceptors.response.use((response: AxiosResponse) => {// isNoAccess = 0Nprogress.done()const { config, data, status, headers } = responseconsole.log(response, config, data, status, headers, 'response-success')// 下载和预览if (config.url?.includes('downloadBatch') ||config.url?.includes('previewUrl')) {let fileName = ''if (headers['content-disposition']) {const arr = headers['content-disposition'].split(';')// eslint-disable-next-line no-restricted-syntaxfor (const item of arr) {if (item.search('filename') !== -1) {const arr1 = item.split('=')fileName = decodeURIComponent(arr1[arr1.length - 1])break}}} else {const fileReader: any = new FileReader()fileReader.readAsText(data, 'utf-8')fileReader.onload = () => {const result = JSON.parse(fileReader.result as string)// 错误提示信息,根据接口返回内容ElMessage.error(result?.message)}}return {data: {data,fileName,},}}if (status !== 200) {ElMessage.error({message: data.message,duration: 4000,})return Promise.reject(response)}// 流接口返回错误处理// if (!data.code && data.type === 'application/json') {// 	const fileReader = new FileReader()// 	fileReader.readAsText(data, 'utf-8')// 	fileReader.onload = () => {// 		const result = JSON.parse(fileReader.result as string)// 		ElMessage.error(result.message)// 	}// 	return null// }if (!data.success && data.code) {ElMessage.error({message: data.message,duration: 4000,})}return data},(error) => {Nprogress.done()console.log(error, 'response-error')if (error.response?.data.code && error.response?.data.code === '2007') {// 手动点击退出登录时,系统token过期 不提示信息if (error.response.config.url !== '/system/user/userLogout') {ElMessage.error('登录状态过期,请重新登录')}const url = router.resolve({path: '/middleBackLogin',query: {loginKey: 'tokenNoAccess',},})window.open(url.href, '_self')} else {ElMessage.error({message: error.message,duration: 4000,})if (error.code === 'ERR_NETWORK') {// 网络问题  强制清除缓存localStorage.clear()// 页面刷新window.location.reload()}}return Promise.reject(error)}
)export default service

在这里插入图片描述

对应接口

在这里插入图片描述

import request from '@/utils/request'
import type { AxiosResponse } from 'axios'
import qs from 'qs'/*** 预览申请* @returns*/
export function previewUrl(id: number | string): Promise<AxiosResponse> {return request({url: `/datawarehouse-api/resourceApply/previewUrl/${id}`,responseType: 'blob', // 因为是流文件,所以要指定blob类型   这里响应blob,axios拦截器是无法拦截接口报错的msg的method: 'get',})
}/*** 下载申请* @returns*/
export function downloadBatch(params = {}): Promise<AxiosResponse> {return request({url: '/datawarehouse-api/resourceApply/downloadBatch',responseType: 'blob', // 因为是流文件,所以要指定blob类型method: 'get',params,// paramsSerializer: get请求,处理数组参数// 传的是:// ids: [xxx,xxx]// 负载为:// ids: xxx    // ids: xxxparamsSerializer(params) {return qs.stringify(params, { arrayFormat: 'repeat' })},})
}

http://www.ppmy.cn/devtools/136694.html

相关文章

游戏AI实现-决策树

代码实现&#xff1a; 定义一个决策树节点 class DecisionTreeNode{public DecisionTreeNode(){} } 定义一个行为类&#xff1a; class Action : DecisionTreeNode{ } 定义一个决策类&#xff1a; class Decision : DecisionTreeNode{ } 应用&#xff1a; 参考书…

goframe开发一个企业网站 MongoDB 完整工具包19

1. MongoDB 工具包完整实现 (mongodb.go) package mongodbimport ("context""fmt""time""github.com/gogf/gf/v2/frame/g""go.mongodb.org/mongo-driver/mongo""go.mongodb.org/mongo-driver/mongo/options" )va…

量子卷积神经网络

量子神经网络由量子卷积层、量子池化层和量子全连接层组成 量子卷积层和量子池化层交替放置&#xff0c;分别实现特征提取和特征降维&#xff0c;之后通过量子全连接层进行特征综合 量子卷积层、量子池化层和量子全连接层分别由量子卷积单元、量子池化单元和量子全连接单元组…

C#中的二维数组的应用:探索物理含义与数据结构的奇妙融合

在C#编程中&#xff0c;二维数组&#xff08;或矩阵&#xff09;是一种重要的数据结构&#xff0c;它不仅能够高效地存储和组织数据&#xff0c;还能通过其行、列和交叉点&#xff08;备注&#xff1a;此处相交处通常称为“元素”或“单元格”&#xff0c;代表二维数组中的一个…

网络安全(骇客)—技术学习

**读者福利 |*** &#x1f91f; 基于入门网络安全/黑客打造的&#xff1a;&#x1f449;黑客&网络安全入门&进阶学习资源包 1.网络安全是什么 网络安全可以基于攻击和防御视角来分类&#xff0c;我们经常听到的 “红队”、“渗透测试” 等就是研究攻击技术&#xff0…

一线大厂面试集锦

String 为什么要设计成不可变的 String被设计成不可变的有以下几个原因: 线程安全:由于String是不可变的,多个线程可以同时访问同一个String对象而无需担心数据被修改。这使得String在多线程环境下是线程安全1. 的。 2.缓存Hash值:由于String是不可变的,它的hashcode可以…

【Anomaly Detection论文阅读记录】PaDiM与PatchCore模型的区别与联系

PaDiM与PatchCore模型的区别与联系 背景介绍 PADIM(Pretrained Anomaly Detection via Image Matching)和 PatchCore 都是基于深度学习的异常检测方法,主要用于图像异常检测,尤其是在无监督学习设置下。 PADIM 是一种通过利用预训练的视觉模型(例如,ImageNet预训练的卷…

【东莞石碣】戴尔R740服务器维修raid硬盘问题

1&#xff1a;石碣某塑料工厂下午报修一台戴尔R740服务器硬盘故障&#xff0c;催的还比较着急。 2&#xff1a;工程师经过跟用户确认故障的问题以及故障服务器型号和故障硬盘型号&#xff0c;产品和配件确认好后&#xff0c;公司仓库确认有该款硬盘现货&#xff0c;DELL 12T S…