vue-cli3 跨域代理proxy总是失败的原因

在vue项目开发中，为了调试方便，我们需要配置跨域代理proxy。根据vue-cli3官方文档，在vue.config.js配置如下

// vue.config.js
module.export={
      devServer: {
            proxy: {
                  '/api':{
                        target: 'http:// your.proxy.site', // 
                        ws: true, // websockets
                        changeOrigin: true,  // needed for virtual hosted sites
                        pathRewrite: {
                              '^/api': ''
                        }
                  }
            }
      }
    
}

结果发现代理无效，浏览器还是会报跨域错误，抓耳挠腮好久，最后终于发现代理写的没有问题，问题是项目异步请求接口中没有拼接 /api 所导致，还有就是接口中本来就是以/api开头的，这时候会让人很混乱，搞不清哪个是代理地址字符串，哪个是真正接口中的字符串。所以分析对了之后，我用下面的方法：

// vue.config.js
module.export={
      devServer: {
            proxy: {
                  '/proxy':{
                        target: 'http:// your.proxy.site', // 
                        ws: true, // websockets
                        changeOrigin: true,  // needed for virtual hosted sites
                        pathRewrite: {
                              '^/proxy': ''
                        }
                  }
            }
      }
    
}

这样，就不会出现和原有接口中的字符串混乱，然后在接口地址中拼接上 /proxy,去请求接口，发现问题已经搞定了。