對axios的封裝

/**axios封裝

* 請求攔截、相應攔截、錯誤統一處理
*/import axios from
'axios'
;import
qsfrom
'qs'
;import
from
'element-ui'
;import store from
'../store/index'
import router from
'../router/index'
// 環境的切換
if(process.env.
node_env
=='development'
)else
if(process.env.
node_env
=='debug'
)else
if(process.env.
node_env
=='production'
)// 請求超時時間
axios.defaults.timeout =
10000
;// post請求頭
axios.defaults.headers.post[
'content-type']=
;axios.defaults.withcredentials =
true
//請求帶上cookie
// 請求***
axios.interceptors.request.
use( 
config =>
,  error =>
)// 響應***
axios.interceptors.response.
use( 
response =>
else},
// 伺服器狀態碼不是200的情況 
error =>
)break
;// 401: 未登入    
// 未登入則跳轉登入頁面，並攜帶當前頁面的路徑    
// 在登入成功後返回當前頁面，這一步需要在登入頁操作。    
case
401:     
router.
replace()
;break
;// 403 token過期    
// 登入過期對使用者進行提示    
// 清除本地token和清空vuex中token物件    
// 跳轉登入頁面    
case
403:
this
.$message()
;// 清除token     
localstorage.
removeitem
('token'
);     
store.
commit
('loginsuccess'
,null);
// 跳轉登入頁面，並將要瀏覽的頁面fullpath傳過去，登入成功後跳轉需要訪問的頁面
settimeout((
)=>})
;},1000);
break
;// 404請求不存在    
case
404:
this
.$message()
;break
;// 其他錯誤，直接丟擲錯誤提示    
default
:alert
(error.response.data.message)
;     router.
replace()
break
}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 [請求時攜帶的引數] 
*/export
function
post
(url, params)).
catch
(err =>)}
);}export
function
del(url,params)).
catch
(err =>)}
)}

對axios的封裝

axios 封裝 請求攔截 相應攔截 錯誤統一處理 import axios from axios eslint disable next line no unused vars import qsfrom qs eslint disable next line no unused vars imp...

Vue中對axios簡單的封裝

源於之前寫的專案 可以參考一下 import vue from vue import axios from axios 匯入axios import from element ui 安裝ui庫後匯入 這個是為了出錯彈框提示的 可做延伸使用 vue.component message var doma...

前端對axios的封裝和使用

axios 是乙個基於 promise 的 http 庫。將axios封裝好後能更高效的開發並且方便維護，而且在以後的專案中也能直接套用，所以封裝好是必要的。在參考了很多方法後，我拼湊出了一套我認為很實用的方法。這個是功能性檔案是拼接url和引數的，讀一遍知道他有什麼功能就行了 const help...