目录
- 工作场景
- nginx 配置
- 解析
工作场景
苦逼码农一个，公司技术上希望跟上潮流，但人员不希望跟上，所以前后一起开发，对于只开发前端代码的人来说可以 mock 数据，但是本人既然连后台代码一起开发，希望通过 nginx 代理直接访问接口返回数据，so…
nginx 配置
server {
listen 8085;
server_name localhost;
location / {
proxy_pass http://localhost:4200;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection \”upgrade\”;
}
location ~ /server/.+ {
rewrite /server/(.+) /$1 break;
proxy_pass http://localhost:8082;
proxy_cookie_path ~*^/.+/([^/]*) /$1;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Real-IP $remote_addr;
}
}
解析
自动略过 server 的前两行
- 第一个 location 代理的是前端开发服务，服务启动在 4200 端口； 这个 location 的后 3 行配置是为了让 nginx 可以代理 websocket , 生产中如果工程中没有 websocket 可以不用； 开发中 websocket 主要是为了方便快速的在代码重新发布之后可以自动刷新页面
- 第二个 location 代理的是后台服务器，~ /server/.+代表这个 location 会处理所有符合这个正则的请求，不会与 第一个 location 的/冲突，因为 ～ 比 默认的匹配模式高
- 第二个 location 中第一行 rewrite 是重写请求 url，比如 请求的是 /server/service-name/user/currentUser，实际想要请求的是 /service-name/user/currentUser, 所以需要 nginx 重写这个请求的地址
- proxy_cookie_path针对的是 服务器响应头中的Set-cookie的 Path 属性，因为后台服务器返回给前台的 cookie 是带有自身的 contextpath 的，比如：springboot 中配置了 server.servlet.content-path=mall 或者 tomcat 中的工程名字是 mall ，那么响应给前台的 Set-cookie 的 path 就是 /mall，但是浏览器在登陆以后的请求时带的 cookies 就没有 path 属性，这会导致登陆状态失效；所以proxy_cookie_path是将 服务器返回 的 cookies 的 path 进行转换的，上面的配置是将服务器返回的 cookies 路径的前缀去掉第一段
以上就是angular6+springboot实现前后分离nginx配置的详细内容，更多关于前后分离nginx配置的资料请关注悠久资源其它相关文章！
