vue中axios請求攔截 響應攔截的配置

2021-09-10 23:39:03 字數 1811 閱讀 3585

1.在vue專案的 src/ 資料夾下新建乙個資料夾為 plugins,然後在 plugins/ 下新建 axios.js 檔案,寫入如下**

import axios from 'axios'

import from '../router/config'

import from '../config'

import from 'iview'

let loading = null

// 設定基礎apiurl(和請求攔截中的 配置axios請求的url 的功能類似,建議使用下面的)

// axios.defaults.baseurl = ''

// 請求攔截 (這裡以後寫axios請求攔截)

axios.interceptors.request.use(

conf => )

}// 配置axios請求的url $ 是配置的請求url統一字首,配置好就不用重複寫一樣的url字首了,只寫後面不同的就可以了

conf.url = `$$`

// console.log(conf)

// 判斷是否存在token,如果存在的話,則每個http header都加上token

if (sessionstorage.getitem('auth'))

return conf

},err => , 200)

message.error(err.response)

// 丟擲請求錯誤資訊

promise.reject(err.response)

})// 響應攔截 (這裡以後寫axios響應攔截)

axios.interceptors.response.use(

res => , 200)

// 獲取響應的資訊

let meta = res.data.meta

// 根據獲取響應的資訊的code的值 進行相對應的處理

if (meta.code === '3') login`}})

return

}// 根據獲取響應的資訊的code的值 進行相對應的處理

if (meta.code !== '1')

return res.data.data

},err => , 200)

// 丟擲請求錯誤資訊

promise.reject(err.response)

})export default )

}}

1.在vue專案的 src/ 資料夾下新建 config.js 檔案,寫入如下**

// 本地開發網域名稱

const testdomain = ''

// 線上正式伺服器網域名稱

const domain = ''

// 線上測試伺服器網域名稱

// const domain = ''

// 配置版本號

const version = '1.1.4'

// 當前環境

const env = process.env.node_env

const origin = env === 'development' ? testdomain : domain

// config

const config = ` : `$`,

// 專門為excel介面設計的url判斷

excelport: env === 'development' ? `$/api` : `$/back/api`

}// 資料字典分類

const diccode =

export

Vue中如何使用axios請求攔截和響應攔截

vue中如何使用axios請求攔截和響應攔截,首先要建立乙個模組做請求攔截和響應攔截 此模組為封裝的axios,分發不同網域名稱的介面和請求自動新增token import vue from vue import axios from axios import cookie from cookie ...

vue請求攔截響應攔截

2020.10.28 早9.40。今天忙裡偷閒記錄下在vue裡面封裝axios以及請求攔截響應 首先理解整個思路 1 將baseurl提出來,這是訪問服務端的位址。2 使用es6類的寫法封裝axios 3 封裝之後在建立api資料夾在此資料夾裡面引入封裝後的axios,之後就可以建立各個介面。bas...

vue登入攔截與請求 響應攔截

在路由檔案 router.js 中引入 store.js import store from store store 配置需要登入許可權的路由 component resolve require components main resolve 在寫好的路由下方加上判斷該路由是否需要登入許可權 rou...