axios拦截器的使用

·  阅读 284
  1. 新建request.js文件,导入axios
import axios from 'axios'
复制代码
  1. 创建一个axios的实例
const request = axios.create({
  baseURL: xxx,
  // baseURL: '项目基地址'
  timeout: 5000 // 设置5秒延时关闭请求
}) 
复制代码
  1. 设置请求拦截器
// request.interceptors.request.use() // 请求拦截器
request.interceptors.request.use(config => {
  
  config.headers.Authorization = `Bearer ${token}` // 设置请求头携带token
  return config 
}, error => {
  console.log(error) // 发生错误打印
  return error
})
复制代码
  1. 设置响应拦截器
// request.interceptors.response.use() // 响应拦截器
request.interceptors.response.use(config => {
  return config // 成功直接返回
}, error => {
  if (error.response.status === 401) { //如果发生错误,查看错误码是多少 401为权限不够,token过期
    alert('token请求超时!请重新登录!')
    // 进行操作,如删除vuex中过期用户数据等一系列操作
    router.push('/login') // 强行返回到登录页
  }
  return error
})
复制代码
  1. 导出axios实例
export default request
复制代码
分类:
前端
标签:
分类:
前端
标签:
收藏成功!
已添加到「」, 点击更改