vue axios拦截器的封装
生活随笔
收集整理的這篇文章主要介紹了
vue axios拦截器的封装
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
// request.js import axios from 'axios'
import qs from 'qs'// 創(chuàng)建axios實(shí)例
const service = axios.create({timeout: 10000, // 請(qǐng)求超時(shí)時(shí)間transformrequest: data => qs.stringify(data)
})
// request攔截器
service.interceptors.request.use(config => {config.headers['X-Requested-With'] = 'XMLHttpRequest'config.headers['X-Platform'] = window.__wxjs_environment === 'miniprogram' ? 'MiniProgram' : 'H5'return config},error => ({ status: 0, msg: error.message })
)// respone攔截器
service.interceptors.response.use(response => {const res = responseif (response.status === 200) {switch (res.status) {case 0: // 錯(cuò)誤并提示if (!response.config.errorSelf) {//
}return { data: res.data, msg: res.msg, status: false }case 1: // 成功返回?cái)?shù)據(jù)return { data: res.data, msg: res.msg, status: true }case -1: // 暫不進(jìn)行任何操作return { data: res.data, status: false }default:return { data: res.data, status: true }}}return { data: response.data, status: false }},error => {console.log('err' + error) // for debugswitch (error.request.status) {case 401: // 無(wú)權(quán)限訪問(wèn)，需要登錄return Promise.reject ? Promise.reject(error) : errorcase 500: // 請(qǐng)求接口錯(cuò)誤if (error.config.linkError) {//
}return Promise.reject ? Promise.reject(error) : error}return Promise.reject ? Promise.reject(error) : error}
)export default service
調(diào)用：
import request from '@/utils/request'/*** 登錄*/ export function login (data) {return request({url: '/sqlapi/login',method: 'post',data: {username: data.username,password: data.password}}) }?
轉(zhuǎn)載于:https://www.cnblogs.com/Jbridge/p/10643980.html
總結(jié)
以上是生活随笔為你收集整理的vue axios拦截器的封装的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： 杂项-公司：联邦快递百科-un
- 下一篇： 关于mpi的理论知识以及编写程序来实现数