Vue前端面试题总结（九）Axios拦截详解

最新推荐文章于 2024-08-04 21:45:12 发布

外下羊.

最新推荐文章于 2024-08-04 21:45:12 发布

阅读量1.8k

点赞数 1

分类专栏：面试文章标签： javascript

本文链接：https://blog.csdn.net/Rick_and_mode/article/details/108614370

版权

面试专栏收录该内容

39 篇文章 9 订阅

订阅专栏

Axios拦截

axios拦截分为请求式拦截跟响应式拦截

request请求拦截器：发送请求前统一处理，如：设置请求头headers等。
response响应拦截器：有时候我们要根据响应的状态码来进行下一步操作

Axios请求式拦截

axios.interceptors.request.use(config => {
  config.interceptors = '请求拦截器'
  return config
}, function(error) {
 
})

Axios响应式拦截

// 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) // 返回接口返回的错误信息
  })