关于Nginx代理前后端接口

最近在开发公司的前后端分离的项目，前端使用Vue,后端使用SpringBoot,本来我是想用Vue的代理功能，去请求后端接口，但是不知道死活代理不同。

proxy: {
    '/api': {
	 	target: 'http://127.0.0.1:8981/api/',
  		pathRewrite: {
	    '^/api': '/'
   }
}

这样的写法各种出现问题，比如404等问题。

后来问了一下我们公司的老员工，他说现在不建议这么配。直接用Nginx代理前后端就好。

# 代理前端的地址
location /data-pages {
	proxy_pass  http://localhost:8021/data-pages/;
}

# 代理后端地址
location /api/ {
	proxy_pass http://localhost:28090/api/;
}

之前我想的是，Vue用的是8021端口，所以后端请求过去就会变成 http://localhost:8021/api/,但是其实不是这样的。后端地址是看浏览器中的url然后拼接过去的。所以经过Nginx代理之后，后端的接口也能通过Nginx代理，这样就能解决问题。