axios二次封裝 和api統一管理

在src 下新建request目錄，在目錄下新增http.js api.js檔案

http.js檔案

/**axios封裝

* 請求攔截、相應攔截、錯誤統一處理
*/import axios from 'axios'
;import qs from 'qs'
;import from 'vant'
;import store from '../store/index'
axios.defaults.baseurl =
'';// 請求超時時間
axios.defaults.timeout =
10000
;// post請求頭
axios.defaults.headers.post[
'content-type']=
;// 請求***
axios.interceptors.request.
use(
config =
>
return config;},
error =
>
)// 響應***
axios.interceptors.response.
use(
response =
>
else},
// 伺服器狀態碼不是200的情況
error =
>})
;break
;// 403 token過期
// 登入過期對使用者進行提示
// 清除本地token和清空vuex中token物件
// 跳轉登入頁面
case
403:
toast()
;// 清除token
localstorage.
removeitem
('token');
store.
commit
('loginsuccess'
, null)
;// 跳轉登入頁面，並將要瀏覽的頁面fullpath傳過去，登入成功後跳轉需要訪問的頁面
settimeout((
)=>})
;},1000);
break
;// 404請求不存在
case
404:
toast()
;break
;// 其他錯誤，直接丟擲錯誤提示
default
:toast()
;}return promise.
reject
(error.response);}
});/**
* get方法，對應get請求
* @param url [請求的url位址]
* @param params [請求時攜帶的引數]
*/export function get
(url, params)).
then
(res =
>).
catch
(err =
>)}
);}/**
* post方法，對應post請求
* @param url [請求的url位址]
* @param params [請求時攜帶的引數]
;

//先引入

import from '../../request/api.js'
login()
.then
(res =
>);
})

import vue from 'vue'

;import vuex from 'vuex'
vue.
use(vuex)
;const state=
const mutations =
}const store = new vuex.
store()
;export default store;

import store from './store'

new vue
()

axios二次封裝

引入路由 import router from router index 引入vuex import store from store index 引入提示元件 import from element ui 引入api import apilist from apilist 引入qs let htt...

axios二次封裝

axios封裝 axios請求 axios二次封裝 封裝公共請求 123 4567 891011 1213 1415 1617 1819 2021 2223 2425 2627 2829 3031 3233 import axios from axios import from element ui...

axios的二次封裝

這次是對axios進行簡單的二次封裝 vue專案中 提供ajax請求 對axios進行二次封裝 判斷是否成功 return this issuccess response 判斷響應結果是否成功 static issuccess res else 構建失敗物件 static requestexpect...