① 版本① axios 封装
1 axios 封装
@/utils/request
1. 创建axios实例
const service = axios.create({
baseURL: process.env.BASE_API, // api的base_url
timeout: 5000 // 请求超时时间
})
2. request拦截器
service.interceptors.request.use(config => {
// Do something before request is sent
if (store.getters.token) {
config.headers['X-Token'] = getToken()
}
return config
}, error => {
Promise.reject(error)
})
3. respone拦截器
service.interceptors.response.use(
response => {
const res = response.data
if(res.code && res.code !== 0) {
var msg = res.msg || res.data
if(res.code === 100002) {
removeToken()
Message({
message: '登录超时,请重新登录',
type: 'error',
duration: 3 * 1000
})
sessionStorage.clear()
router.replace({
path: '/login?redirect=/welcome'
})
return Promise.reject(res)
} else {
Message({
message: msg || 'Error',
type: 'error',
duration: 5 * 1000
})
return Promise.reject(new Error(res.msg || 'Error'))
}
} else {
return res
}
},
error => {
const msg = error.response.data.msg
const statusCode = error.response.status
const code = error.response.data.code
if(code && code === 100002 || statusCode && statusCode === 401) {
removeToken()
Message({
message: '登录超时,请重新登录',
type: 'error',
duration: 3 * 1000
})
sessionStorage.clear()
router.replace({
path: '/login?redirect=/welcome'
})
return Promise.reject(error)
} else {
Message({
message: msg || error.toString(),
type: 'error',
duration: 5 * 1000
})
}
return Promise.reject(error)
}
)
4. Cookie 相关
import Cookies from 'js-cookie'
const TokenKey = 'Admin-Token'
export function getToken() {
return Cookies.get(TokenKey)
}
export function setToken(token) {
return Cookies.set(TokenKey, token)
}
export function removeToken() {
return Cookies.remove(TokenKey)
}
2 api定义
import request from '@/utils/request'
export function getTreeData() {
return request({
url: `/api/resource/getTreeData`,
method: 'GET'
})
}
3 使用
import { getTreeData } from '@/api/resource'
async getTreeData() {
this.treeLoading = true
let res = await getTreeData()
this.treeLoading = false
if(res && res.code == 0) {
this.resourceTreeData = res.data
} else {
this.$message.error('请求出现错误,请稍后重试');
}
}