vue-cli 3.0之跨域请求devServer proxy代理配置
当我们的前端服务和后端服务不同源即协议不同，端口不同，域名不同时，就会出现跨域的问题。
通过配置devServer.proxy就可以解决跨域的问题。
基本配置：
// 将任何未知请求 (没有匹配到静态文件的请求) 代理到http://localhost:4000module.exports = {devServer: {proxy: 'http://localhost:4000'}}
详细配置：
dev-server.proxy使用功能强大的 http-proxy-middleware 软件包。
假如我们需要请求：/api/loginPost
但实际请求是：http://localhost:3000/api/loginPost
我们需要请求到 下的接口就需要配置：
module.exports = {devServer: {proxy: {// 只有碰到/api的才会执行代理'/api': {target: '', // 要访问的跨域的域名ws: true, // 是否启用websocketschangeOrigin: true // 开启代理：在本地会创建一个虚拟服务端，然后发送请求的数据，并同时接收请求的数据，这样客户端端和服务端进行数据的交互就不会有跨域问题}}}}
pathRewrite属性的用处：
如果我们要请求：/api/loginPost
但实际请求是：http://localhost:3000/mock/loginPost
module.exports = {devServer: {proxy: {'/mock': {target: '',ws: true,changeOrigin: true,pathRewrite: {'^/mock': '/api'}}}}}
如果觉得《vue-cli 3.0之跨域请求devServer proxy代理配置》对你有帮助，请点赞、收藏，并留下你的观点哦！
