axios拦截请求,向应拦截

最近在项目中要用到拦截器,拦截每一次你的请求和响应,然后进行相应的处理。比如一些网站过了一定的时间不进行操作,就会退出登录让你重新登陆页面,在这期间是token神门的验证过期了,也可以理解为身份登录过期了。
 
 
import axios from 'axios'  //引入axios
//下面这两个不一定需要引入,看你项目需要拦截的时候做什么操作,但是一般都需要引入store
import store from '@/store/index'  //引入store
import router from '@/router'  //引入router


创建出一个axios的实例

  

let instance = axios.create({
  headers: {
    'content-type': 'application/x-www-form-urlencoded'
  }
})


编辑请求拦截
instance.interceptors.request.use(
  config => {
    const token = sessionStorage.getItem('token')
    if (token ) { // 判断是否存在token,如果存在的话,则每个http header都加上token
      config.headers.authorization = token  //请求头加上token
    }
    return config
  },
  err => {
    return Promise.reject(err)
  })

编辑响应拦截
// http response 拦截器
instance.interceptors.response.use(
  response => {
    //拦截响应,做统一处理 
    if (response.data.code) {
      switch (response.data.code) {
        case 1002:
          store.state.isLogin = false
          router.replace({
            path: 'login',
            query: {
              redirect: router.currentRoute.fullPath
            }
          })
      }
    }
    return response
  },
  //接口错误时,返回相对应的报错
  error => {
    return Promise.reject(error.response.status) // 返回接口返回的错误信息
  })
抛出拦截
export default instance
 


posted @ 2020-08-13 07:47  玖捌  阅读(142)  评论(0)    收藏  举报