spring boot+vue前后端分离跨域proxy配置问题踩坑

部门原来的项目是前后端一体的项目，现在有意拆成前后端分离的项目，想用原来的前端模板改写。当时解决跨域用的方法比较粗暴，加之只考虑本地运行，用的是将前端请求路径写死，后端接受所有请求的方法，见下：
Django+vue前后端分离项目的跨域问题

部门项目本地开发后会远程部署，此方法不再适用，需要支持请求地址更改方便。查了可以在vue.config.js里配置proxy解决此问题

首先参考了配置文档

配置后报错Proxy error: Could not proxy request /api/step/test from localhost:8001 toxxx

https://blog.csdn.net/Reagan_/article/details/97498160

参考此链接进行了配置，依然报错

博客在这里着重写了Windows和Mac路径写法的区别，跟着使用了红框写法

https://blog.csdn.net/qq_36028750/article/details/106472330

又查到了上文，加上了http://问题解决

配置可参考：

module.exports = {
	devServer: {
		proxy: {
			"/api": { //自定义
				target: "http://你的服务器地址/api", //这里可以跟随项目实际部署服务器来
				changeOrigin: true,
				ws: true,
				pathRewrite: {
				"^/api": ""//自定义
				}
			}
		}
	}
}
————————————————
版权声明：本文为CSDN博主「weixin_39634443」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/weixin_39634443/article/details/111811518

附上代码：
配置

proxy:{
      '/api':{
          target:'http://172.18.3.106:8081', 
          changeOrigin:true, 
          pathRewrite:{'^/api' : ''}
      }
    }

前端请求

show(){
          this.$http.get('/api/step/test')
          .then((response) => {
            console.log(response.bodyText)
          })
        }

后端

    @RequestMapping("/test")
    public String test(){
        SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
        Date date = new Date();
        System.out.println("ok"+sdf.format(date));
        return "success";
    }

没有完全定位问题原因，但这样操作后目前解决了问题，留记录以供参考

---

2021.3.12更新

Proxy error: Could not proxy request /step/test from localhost:9528 to http://172.28.100.132.
See https://nodejs.org/api/errors.html#errors_common_system_errors for more information (ECONNREFUSED).

换了项目，重新配置后没有加端口号，出现这个报错，加上端口号后问题解决