vben-admin 2.8.0 版本修改 axios響應處理邏輯

此前端框架下的 Axios 在后端返回的結果老是無法正常解析,找到他源碼的封裝類,修正這個問題

文件位于?src\utils\http\axios\index.ts

修改前

  transformResponseHook: (res: AxiosResponse<Result>, options: RequestOptions) => {const { t } = useI18n()const { isTransformResponse, isReturnNativeResponse } = options// 是否返回原生響應頭 比如:需要獲取響應頭時使用該屬性if (isReturnNativeResponse) {return res}// 不進行任何處理,直接返回// 用于頁面代碼可能需要直接獲取code,data,message這些信息時開啟if (!isTransformResponse) {return res.data}// 錯誤的時候返回const { data } = resif (!data) {// return '[HTTP] Request has no return value';throw new Error(t('sys.api.apiRequestFailed'))}//  這里 code,result,message為 后臺統一的字段,需要在 types.ts內修改為項目自己的接口返回格式const { code, result, message } = data// 這里邏輯可以根據項目進行修改const hasSuccess = data && Reflect.has(data, 'code') && code === ResultEnum.SUCCESSif (hasSuccess) {return result}// 在此處根據自己項目的實際情況對不同的code執行不同的操作// 如果不希望中斷當前請求,請return數據,否則直接拋出異常即可let timeoutMsg = ''switch (code) {case ResultEnum.TIMEOUT:timeoutMsg = t('sys.api.timeoutMessage')const userStore = useUserStoreWithOut()userStore.setToken(undefined)userStore.logout(true)breakdefault:if (message) {timeoutMsg = message}}// errorMessageMode=‘modal’的時候會顯示modal錯誤彈窗,而不是消息提示,用于一些比較重要的錯誤// errorMessageMode='none' 一般是調用時明確表示不希望自動彈出錯誤提示if (options.errorMessageMode === 'modal') {createErrorModal({ title: t('sys.api.errorTip'), content: timeoutMsg })} else if (options.errorMessageMode === 'message') {createMessage.error(timeoutMsg)}throw new Error(timeoutMsg || t('sys.api.apiRequestFailed'))},

重點是這幾行的解析有問題, Res 無法直接解構到 data

    const { data } = resif (!data) {// return '[HTTP] Request has no return value';throw new Error(t('sys.api.apiRequestFailed'))}//  這里 code,result,message為 后臺統一的字段,需要在 types.ts內修改為項目自己的接口返回格式const { code, result, message } = data// 這里邏輯可以根據項目進行修改const hasSuccess = data && Reflect.has(data, 'code') && code === ResultEnum.SUCCESSif (hasSuccess) {return result}

修改后

  transformResponseHook: (res: AxiosResponse<Result>, options: RequestOptions) => {const { t } = useI18n()const { isTransformResponse, isReturnNativeResponse } = options// 是否返回原生響應頭 比如:需要獲取響應頭時使用該屬性if (isReturnNativeResponse) {return res}// 不進行任何處理,直接返回// 用于頁面代碼可能需要直接獲取code,data,message這些信息時開啟if (!isTransformResponse) {return res.data}// 錯誤的時候返回const content = res.data;if (!content) {// return '[HTTP] Request has no return value';throw new Error(t('sys.api.apiRequestFailed'))}//  這里 code,result,message為 后臺統一的字段,需要在 types.ts內修改為項目自己的接口返回格式const { code, data, message } = content// 這里邏輯可以根據項目進行修改const hasSuccess = content && Reflect.has(content, 'code') && code === ResultEnum.SUCCESSif (hasSuccess) {return data}// 在此處根據自己項目的實際情況對不同的code執行不同的操作// 如果不希望中斷當前請求,請return數據,否則直接拋出異常即可let timeoutMsg = ''switch (code) {case ResultEnum.TIMEOUT:timeoutMsg = t('sys.api.timeoutMessage')const userStore = useUserStoreWithOut()userStore.setToken(undefined)userStore.logout(true)breakdefault:if (message) {timeoutMsg = message}}// errorMessageMode=‘modal’的時候會顯示modal錯誤彈窗,而不是消息提示,用于一些比較重要的錯誤// errorMessageMode='none' 一般是調用時明確表示不希望自動彈出錯誤提示if (options.errorMessageMode === 'modal') {createErrorModal({ title: t('sys.api.errorTip'), content: timeoutMsg })} else if (options.errorMessageMode === 'message') {createMessage.error(timeoutMsg)}throw new Error(timeoutMsg || t('sys.api.apiRequestFailed'))},

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/pingmian/82733.shtml
繁體地址,請注明出處:http://hk.pswp.cn/pingmian/82733.shtml
英文地址,請注明出處:http://en.pswp.cn/pingmian/82733.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

深入理解JavaScript設計模式之原型模式

目錄 前言引入原型模式頭腦風暴傳統方式 vs 原型模式實戰案例&#xff1a;飛機大戰中的分身術 原型模式實現的關鍵秘密實戰演練&#xff1a;造一架能分身的飛機克隆是創建對象的手段原型模式&#xff1a;輕裝上陣的造物術 原型編程范型的一些規則原型編程的四大門規&#xff1a…

【數據庫】概述(純理論)

數據庫系統引論 數據管理系統的發展 數據管理&#xff1a;對數據分類、組織、編碼、存儲、檢索、維護 發展&#xff1a;人工管理、文件系統、數據庫系統 40-50年代 人工管理 數據不保存&#xff0c;沒有專門軟件管理數據&#xff0c;應用程序完全依賴于數據&#xff0c;數據…

語音合成之十七 語音合成(TTS)中文自然度:問題、成因、解決方案

語音合成&#xff08;TTS&#xff09;中文自然度&#xff1a;問題、成因、解決方案 中文TTS系統基本架構中文TTS常見問題深度剖析與解決方案音色跳變成因分析解決方案 聲調與重讀錯誤成因分析業界解決方案 漏讀與斷句錯誤成因分析業界解決方案 在跨語言TTS系統比較中&#xff0…

我在 Linux 進程管理中踩過的坑:僵尸、瞬時與不可中斷進程實戰實錄

作為運維老鳥&#xff0c;我曾在 Linux 進程管理上栽過不少跟頭。記得第一次遇到滿屏僵尸進程時&#xff0c;服務器直接卡到連 SSH 都登不上&#xff0c;看著ps命令里一排排刺眼的Z狀態進程&#xff0c;手心直冒冷汗。后來又碰到過瞬時進程搞崩日志系統&#xff0c;明明監控顯示…

【設計模式】簡單工廠模式,工廠模式,抽象工廠模式,單例,代理,go案例區分總結

工廠模式三種類型&#xff1a; 一、簡單工廠模式&#xff08;Simple Factory&#xff09; 定義&#xff1a; 用一個工廠類&#xff0c;根據傳入的參數決定創建哪一種具體產品類實例。 面試說法&#xff1a; 由一個統一的工廠創建所有對象&#xff0c;增加新產品時需要修改工…

某標桿房企BI平臺2.0升級實踐

當房地產行業從“規模競賽”轉向“精益運營”&#xff0c;數字化轉型成為破局關鍵。某千億房企攜手億信華辰&#xff0c;以“用數據重構業務價值鏈”為目標&#xff0c;歷經6個月完成BI平臺戰略性升級。在這場從“數據可視化”到“決策智能化”的躍遷中&#xff0c;億信華辰ABI…

Lua 腳本在 Redis 中的運用-24 (使用 Lua 腳本實現原子計數器)

實踐練習:使用 Lua 腳本實現原子計數器 實現原子計數器是許多應用程序中的常見需求,例如跟蹤網站訪問量、限制 API 請求或管理庫存。雖然 Redis 提供了 INCR 命令用于遞增整數,但在復雜場景或與其他操作結合時直接使用它可能并不足夠。本課程探討了如何在 Redis 中利用 Lua…

Rust 學習筆記:使用迭代器改進 minigrep

Rust 學習筆記&#xff1a;使用迭代器改進 minigrep Rust 學習筆記&#xff1a;使用迭代器改進 minigrep不使用 clone&#xff0c;而使用迭代器使用迭代器適配器使代碼更清晰在循環或迭代器之間進行選擇 Rust 學習筆記&#xff1a;使用迭代器改進 minigrep 前情提要&#xff1…

el-table配置表頭固定而且高度變化

根據官網提示只要在 el-table 元素中定義了 height 屬性&#xff0c;即可實現固定表頭的表格&#xff0c;而不需要額外的代碼。 如果你想既要固定表頭&#xff0c;又要下方表格高度自適應&#xff0c;可以設置為 height"100%" &#xff1a; 然后外層設置scroll:

弱光環境下如何手持相機拍攝靜物:攝影曝光之等效曝光認知

寫在前面 博文內容為一次博物館靜物拍攝筆記的簡單總結內容涉及&#xff1a;弱光環境拍攝靜物如何選擇&#xff0c;以及等效曝光的認知理解不足小伙伴幫忙指正 &#x1f603;,生活加油 我看遠山&#xff0c;遠山悲憫 持續分享技術干貨&#xff0c;感興趣小伙伴可以關注下 _ 采…

ARM筆記-ARM偽指令及編程基礎

第四章 ARM偽指令及編程基礎 4.1 偽指令概述 4.1.1 偽指令定義 人們設計了一些專門用于指導匯編器進行匯編工作的指令&#xff0c;由于這些指令不形成機器碼指令&#xff0c;它們只是在匯編器進行匯編工作的過程中起作用&#xff0c;所以被叫做偽指令。 4.1.2 偽指令特征 …

智能手表怎么申請歐盟EN 18031認證

智能手表申請歐盟 EN 18031 認證&#xff08;針對消費類物聯網設備的網絡安全標準&#xff09;的流程與智能門鎖類似&#xff0c;但需結合手表的功能特性&#xff08;如數據交互、定位、支付等&#xff09;調整合規重點。以下是具體流程和關鍵要點&#xff1a; 一、標準適配與…

算法-全排列

1、全排列函數的使用 舉例&#xff1a;{1,2,3}的全排列 #include<iostream> #include<bits/stdc.h> using namespace std; typedef long long ll; int main(){ll a[3] {1, 2, 3};do{for (ll i 0; i < 3;i){cout << a[i] << " ";}cout…

面試加分秘籍:校招數據傾斜場景下的SQL優化方案

校招面試經常會問大家有沒有過調優的經驗&#xff0c;相信大家的回答基本都是往數據傾斜和小文件問題這兩方面回答&#xff0c;對于數據傾斜相信大部分同學對熱key打散或null值引發的傾斜已經非常熟悉&#xff0c;但這些內容面試官也是聽膩了&#xff0c;希望大家在面試時候講一…

Elasticsearch索引機制與Lucene段合并策略深度解析

引言 在現代分布式搜索引擎Elasticsearch中&#xff0c;文檔的索引、更新和刪除操作不僅是用戶交互的核心入口&#xff0c;更是底層存儲架構設計的關鍵挑戰。本文圍繞以下核心鏈路展開&#xff1a; 文檔生命周期管理&#xff1a;從客戶端請求路由到分片定位&#xff0c;從內存…

git提交更改

第一步&#xff1a;添加改動 git add . 第二步&#xff1a;提交改動 git commit -m “替換了 SerialPort 庫文件” 第三步&#xff1a;推送到遠程 git push 為什么git 的UI界面做的遠不如SVN

WPF的基礎控件:布局控件(StackPanel DockPanel)

布局控件&#xff08;StackPanel & DockPanel&#xff09; 1 StackPanel的Orientation屬性2 DockPanel的LastChildFill3 嵌套布局示例4 性能優化建議5 常見問題排查 在WPF開發中&#xff0c;布局控件是構建用戶界面的基石。StackPanel和DockPanel作為兩種最基礎的布局容器&…

互聯網大廠Java求職面試:AI大模型推理服務性能優化與向量數據庫分布式檢索

互聯網大廠Java求職面試&#xff1a;AI大模型推理服務性能優化與向量數據庫分布式檢索 面試現場&#xff1a;技術總監的連環追問 技術總監&#xff1a;&#xff08;翻看著簡歷&#xff09;鄭薪苦&#xff0c;你在上一家公司參與過LLM推理服務的性能優化項目&#xff1f;說說你…

如何解決網站服務器的異常問題?

當網站服務器出現異常情況&#xff0c;導致用戶無法正常訪問網頁信息的時候&#xff0c;該如何解決這一問題呢&#xff1f;小編下面就帶領大家共同探討一下這一問題。 企業在面對網站服務器異常時&#xff0c;首先要對服務器硬件設備進行詳細的檢查&#xff0c;可以使用硬盤檢測…

Day 35

模型可視化與推理 知識點回顧&#xff1a; 三種不同的模型可視化方法&#xff1a;推薦torchinfo打印summary權重分布可視化 進度條功能&#xff1a;手動和自動寫法&#xff0c;讓打印結果更加美觀 推理的寫法&#xff1a;評估模式 模型結構可視化 理解一個深度學習網絡最重要的…