项目配置axios多后端模块请求

思路：

1. 每个请求都配置一个请求对应的服务requestBase
2. 在不同的环境下，配置不同的基础路径
3. 在axios请求之前根据，环境和请求不同的服务，请求链接拼接不同的服务地址（请求拦截）

具体实现：

1.get请求为例

export const getRequest = (url,requestBase={},params) => {
    return axios({
        method: 'get',
        url: `${url}`,
        requestBase:requestBase.requestBase,
        params: params,
        headers: {}
    });
};

2.不同环境下的不同配置

//.env.development
NODE_ENV = 'development'
VUE_APP_URL = 'development';
VUE_APP_BASE_API1 = 'https://www.baidu.com/api'
VUE_APP_BASE_API2 = 'https://www.sina.com/api
VUE_CLI_BABEL_TRANSPILE_MODULES = true

//.env.production
NODE_ENV = 'production'
VUE_APP_URL = 'production';
VUE_APP_BASE_API1 = 'https://www.baidu.com/apiProd'
VUE_APP_BASE_API2 = 'https://www.sina.com/Prod'

3.请求拦截：

axios.interceptors.request.use(config => {
    if(config.requestBase==='VUE_APP_BASE_API2'){
        config.baseURL = process.env.VUE_APP_BASE_API2
    }else if(config.requestBase==='VUE_APP_BASE_API1'){
        config.baseURL = process.env.VUE_APP_BASE_API1
    }
    return config;
}, err => {
    console.log('请求超时');
    return Promise.resolve(err);
});

请求后台具体接口时：

export const getUserData = (params) => {
    return postRequest('/getUserData' ,{requestBase:'VUE_APP_BASE_API1'},params)
}