官网使用Nginx实现动静分离
Nginx 是俄罗斯人 伊戈尔·赛索耶夫( Igor Sysoev)开发的 一个 HTTP 和反向代理服务,邮件代理服务器,此外还可以作为 TCP/UDP 代理服务器。 仅 2021 年 7月里 Nginx 代理了市场 22.57% 的站点。这还不包括很多内网使用的站点,以及淘宝基于 Nginx 开发的 Tengine。再次致敬作者!
Nginx 作为 HTTP 反向代理服务器,主要用途之一就是实现网站的动静分离。
刚好公司上个月开发新版官网,和另一个同事一起完成,我主导开发,技术栈是 springboot + mybatisPlus +freemarker + ElasticSearch +Nginx ,关于具体的实现思路,如果有人感兴趣的话,后续可以专门写一篇文章。
话不多说,直接先上图:
简单解释下:
1. 浏览器访问官网域名会跳转到 /usr/share/nginx/html下的index.html
2. 在html 文件会通过异步请求发送 /back/ 开头的url 请求后台接口
下面根据上图的需求,配置 nginx.conf, 注意在 http 模块中添加如下配置:
server {
listen 80;
# 配置你的域名
server_name www.xxx.com;
# 默认路由到 /usr/share/nginx/html 下的 index.html
location / {
root /usr/share/nginx/html;
index index.html index.htm;
}
# 请求 /back 开头的接口时会代理到后台服务
location /back/ {
# 后台服务器,一般配成内网域名,或者 ip:端口
proxy_pass http://backend.website.com;
}
}
这里其实重点用的还是 location 指令, 可以参考之前的文章《Nginx 搭建文件服务器》。这里涉及到一个常用的指令proxy_pass,下面详细介绍下该指令:
# proxy_pass, 使用语法:proxy_pass URL;
# 如果proxy_pass加了 URI, location 中的URI,会被完全替代
# http://xxxxxx/name/hello => http://127.0.0.1/hello;
location /name/ {
proxy_pass http://127.0.0.1:8080/;
}
# 如果proxy_pass没有 URI, location 中的URI,会被追加
# http://xxxxxx/name/path/hello => http://127.0.0.1/name/path/hello
location /some/path/ {
proxy_pass http://127.0.0.1:8080;
}
# 如果proxy_pass 主机名后加了$request_uri, location 中的URI,会被追加
# http://xxxxxx/name/path1/hello1 => http://127.0.0.1/name/path1/hello1
location /name/ {
proxy_pass http://127.0.0.1:8080$request_uri;
}
# 使用 rewrite 指令时,proxy_pass 后的uri(如果有的话)会被 rewrite后的新uri 直接替换
# http://xxxxxx/name/path2/hello2 => http://127.0.0.1/name/path2/hello2
location /name/ {
rewrite /name/([^/]+) /users?name=$1 break;
proxy_pass http://127.0.0.1:8080;
# 下面的写法,uri /会被替换,所以也能正常跳转
# proxy_pass http://127.0.0.1/;
}
根据大家的反馈,后面会考虑分享Nginx的另个一重要功能:负载均衡。
如果觉得还不错的话,关注、分享、在看(关注不会走丢~), 原创不易,且看且珍惜~