vue cli4跨域问题的解决

在开发环境下可以前端配置devServer解决跨域问题
在package.json同级目录下新建一个vue.config.js文件，配置如下代码

module.exports = {
    devServer: {
        overlay: {
            // 让浏览器 overlay 同时显示警告和错误
            warnings: true,
            errors: true
        },
        host: 'localhost',
        port: 8080, // 端口号
        https: false, // https:{type:Boolean}
        open: true, // 配置自动启动浏览器
        hotOnly: true, // 热更新
        proxy: {
            // 配置多个跨域
            '/api': {
                target: 'http://192.168.1.106:8002',//跨域接口的地址
                changeOrigin: false,
                pathRewrite: {
                    '^/api': ''
                }
            }
        },
        headers: {
            'Access-Control-Allow-Origin': '*',
        }
    }
};

温馨提示:axios中baseURL的地址需要与devServer中保持一致，否则即使配置成功仍然会显示跨域，或者地址不存在的话还会报404错误。我就遇到了这个问题，“||”分割开的地址应用顺序是从第一个开始，如果第一个地址存在就不再使用后面的地址，所以如果前面配置了错误的地址，可不就404了嘛！！！我这么理解可有问题，大家告诉我一下呗

axios.js