请求拦截器和响应拦截器

279 阅读1分钟

请求拦截器一般用于使每次请求都携带token以保证请求权限

axios.interceptors.request.use(
    config => {
        if (localStorage.getItem('token')) {
            // 如果后台要token这么写:
            config.headers.Authorization = localStorage.getItem('token')
            // 如果后台要Authorization 这么写:config.headers.Authorization = `Bearer ` + localStorage.getItem('token')
        }
        return config
    },
    error => {
        return Promise.reject(error)
    }
)

响应拦截器一般用于处理401,即身份认证失败的情况

// 添加响应拦截器
axios.interceptors.response.use(
    // 响应 没有报错的 回调函数
    function (response) {
        // 对响应数据做点什么
        // console.log(response)
        if (response.data.statusCode == 401) {
            console.log(location.href, location.hash)
            // 跳转回登陆页面的时候,将当前的url地址做为参数传递
            location.href = '#/login?redirectUrl=' + location.href
            // location.href = '#/login?redirectUrl=' + location.hash.substring('#')
        }

        return response
    },
    // 响应报错的回调函数
    function (error) {
        // 对响应错误做点什么
        return Promise.reject(error)
    }
)