vue项目配置本地代理转发 | proxy

这里的vue代理是 vue静态服务器做代理。使用的是 http-proxy-middleware 这个模块（这个模块相当于是node.js的一个插件）。

proxy配置代码

//vue-cli3.0 里面的 vue.config.js做配置 没有可以将自己建一个
devServer: {
	proxy: {
		// 这里监听一个别名，下面替换掉
		'/api': {     //这里最好有一个 /
			target: 'http://172.16.18.26:8081',  // 后台接口域名
			ws: true,        //如果要代理 websockets，配置这个参数
			secure: false,  // 如果是https接口，需要配置这个参数
			changeOrigin: true,  //是否跨域
			pathRewrite:{
				'^/api':'/screen'  //替换成
			}
		},
		'/login': {
			target: 'http://172.16.18.26:8081',
			changeOrigin: true,
			pathRewrite:{
				'^/login':''  //替换成空
			}
		}
	}
}

示例

http://172.16.18.26:8081/screen/index
http://localhost:8080/api/index  --> http://172.16.18.26:8081/screen/index

http://172.16.18.26:8081/index
http://localhost:8080/login/index  --> http://172.16.18.26:8081/index