fetch
get 请求
默认请求方式，不能传参
fetch('https://api.ip.sb/geoip')
.then(res => res.json())
.then(data=>console.log(data))
.catch(err => console.warn(err))
post 请求
参数为字符串类型
fetch('http://api.komavideo.com/news/list', {
method: 'POST',
body: JSON.stringify({
pageSize: 10,
pageIndex: 1,
copyright: 'osc'
})
})
.then(res => res.json())
.then(data => console.log(data))
.catch(err => console.warn(err))
axios
get请求
this.$axios.get('/api/system/indexinfo',{
params: {
id: 12345，
name: user
}
})
.then(res => {
console.log(res)
})
.catch(error => {
console.log(error)
})
post请求
this.$axios.post('/api/members/register', {
phone: '18770043048',
password: '123456a',
inviterCode: '123456'
})
.then(res => console.log(res))
.catch(error => console.log(error))
拦截器
request拦截
axios.interceptors.request.use(
config => {
config.baseURL = '/api/'
config.withCredentials = true // 允许携带token ,这个是解决跨域产生的相关问题
config.timeout = 6000
let token = sessionStorage.getItem('access_token')
let csrf = store.getters.csrf
if (token) {
config.headers = {
'access-token': token,
'Content-Type': 'application/x-www-form-urlencoded'
}
}
if (config.url === 'refresh') {
config.headers = {
'refresh-token': sessionStorage.getItem('refresh_token'),
'Content-Type': 'application/x-www-form-urlencoded'
}
}
return config
},
error => {
return Promise.reject(error)
}
)
response 拦截
axios.interceptors.response.use(
response => {
// 定时刷新access-token
if (!response.data.value && response.data.data.message === 'token invalid') {
// 刷新token
store.dispatch('refresh').then(response => {
sessionStorage.setItem('access_token', response.data)
}).catch(error => {
throw new Error('token刷新' + error)
})
}
return response
},
error => {
return Promise.reject(error)
}
)