zoukankan      html  css  js  c++  java
  • react use axios拦截器

    import axios from 'axios';
    improt Promise from 'es6-promise';
    
    Promise.polyfill();
    
    const axiosService = axios.create();
    
    axiosService.defaults.timeout = 5000;
    axiosService.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
    
    axiosService.interceptors.request.use(
        (config) => {
            if (config.data && config.data.$skipAuthHandler) {
                config.$skipAuthHandler = true;
                delete config.data.$skipAuthHandler;
            }
            if (config.params && config.params.$skipAuthHandler) {
                config.$skipAuthHandler = true;
                delete config.params.$skipAuthHandler;
            }
            config.headers.Authorization = getAuthorization();
            return config;
        },
        (error) => {
            return Promise.reject(error)
        }
    );
    
    axiosService.interceptors.response.use(
        (response) => {
            return response;
        },
        (error) => {
            const err = error.response;
            if (err.status === 401 && !! config.data && !config.data.$skipAuthHandler) {
                user.clear();
                window.location = '/unauthorization';
            }
            return Promise.reject(error);
        }
    );
    
    export default axiosService;

     update:

    import axios from 'axios';
    import {toastr} from "react-redux-toastr";
    
    //import LoginUser from "service/login-service/LoginUser";
    
    Promise.polyfill();
    
    const axiosService = axios.create();
    //const _loginUser = new LoginUser();
    
    axiosService.defaults.timeout = 5000;
    axiosService.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
    
    axiosService.interceptors.request.use(
        (config) => {
            if (config.data && config.data.$skipAuthHandler) {
                config.$skipAuthHandler = true;
                delete config.data.$skipAuthHandler;
            }
            if (config.params && config.params.$skipAuthHandler) {
                config.$skipAuthHandler = true;
                delete config.params.$skipAuthHandler;
            }
            //config.headers.Authorization = _loginUser.getAuthorization();
            return config;
        },
        (error) => {
            return Promise.reject(error)
        }
    );
    
    axiosService.interceptors.response.use(
        (response) => {
            return response;
        },
        (error) => {
            const err = error.response;
            if (err.status === 401 && !! err.config && !err.config.$skipAuthHandler) {
                //_loginUser.clear();
                window.location = '/unauthorization';
            }
            toastr.error(err.data.message);
            return Promise.reject(error);
        }
    );
    
    export default axiosService;

    通用请求服务:

    import axiosService from 'axiosService';
    improt Promise from 'es6-promise';
    
    Promise.polyfill();
    
    export default class RequestService {
        axiosRequest(param) {
         return new Promise((resolve, reject) => {
            axiosService.request({
                url: param.url || '',
                method: param.method || 'GET',
                responseType: param.responseType || 'json',
                data: param.data || null,
                params: param.params || '',
            }).then(res => {
                typeOf resolve === 'function' && resolve(res);
            }).catch(error => {
                typeOf reject === 'function' && reject(error);
            })
         })
        }
    }
  • 相关阅读:
    redis 中 set 和 hset 有什么不同,什么时候使用 hset 什么时候使用set?
    redis的底层数据结构
    python开发-实现redis中的发布订阅功能
    使用redis-py的两个类Redis和StrictRedis时遇到的坑
    python使用redis实现协同控制的分布式锁
    深入理解 Python 异步编程(上)
    linux中read,write和recv,send的区别
    socket常见问题
    python socket 编程之三:长连接、短连接以及心跳
    Flask快速入门
  • 原文地址:https://www.cnblogs.com/Nyan-Workflow-FC/p/8779037.html
Copyright © 2011-2022 走看看