axios 拦截器的基本概念

308 阅读1分钟

拦截器(interceptors)用来全局拦截 axios 的每一次请求与响应。

好处:可以把每个请求中,某些重复性的业务代码封装到拦截器中,提高代码的复用性。

03.png

axios 请求拦截器

    // 添加请求拦截器
    axios.interceptors.request.use(function (config) {
        // 在发送请求之前做些什么
        return config;
    }, function (error) {
        // 对请求错误做些什么
        return Promise.reject(error);
    });

注意:一部分请求拦截器因为所有请求,无须逻辑判断,都要执行操作,所以记性了全局的 axios 默认值

    axios.defaults.baseURL = 'https://api.example.com';
    axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
    axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';

axios 响应拦截器

    // 添加响应拦截器
    axios.interceptors.response.use(function (response) {
        // 对响应数据做点什么
        return response;
    }, function (error) {
        // 对响应错误做点什么
        return Promise.reject(error);
    });