Nginx 是什么
这一课你将能做到
- 用自己的话区分 Web 服务器、反向代理、正向代理,并指出 CodeRoadMap 公网入口属于哪一种
- 画出「浏览器 → Nginx → Spring Boot / Next.js」的请求路径,标出本机端口
:443、:8080、:3000
- 打开仓库
deploy/nginx/prod.conf.example,指出两条 upstream 与两条 location 各自服务谁
为什么要学
把 Spring Boot 与 Next.js 直接暴露在公网 8080/3000,会立刻撞上 TLS、端口混乱、CORS、多进程入口等问题。生产常见做法是:只让 Nginx 听 80/443,应用绑定本机回环地址,由 Nginx 按路径拆流量。
CodeRoadMap 正是这样:/api/* 进 Java,其余进 platform。本课不急着敲配置,先把「Nginx 在架构里干什么」钉死,后面安装、反代、SSL 才有坐标。
不懂边界时,人容易把 Nginx 当成「又一个应用框架」——其实它不管 JWT、不管 RSC,只管连接与转发。
先建立图像
浏览器
│ HTTPS :443(公网只暴露这一层)
▼
Nginx(TLS 终止、按路径分流、安全头)
├─ location /api/ → upstream coderoadmap_backend → 127.0.0.1:8080 Spring Boot
└─ location / → upstream coderoadmap_platform → 127.0.0.1:3000 Next.js
│
└─(业务)→ MySQL / Redis …
人话:Nginx 像小区门岗。访客只认大门地址;门岗看「去哪一栋」,再带你到内院的 Spring 或 Next。访客不必、也不该直接敲内院门牌。
| 角色 | 一句话 | CodeRoadMap 里 |
|---|
| Web 服务器 | 自己读磁盘或生成响应 | admin 静态 root;主站较少直接当文件服务器 |
| 反向代理 | 代表服务端收请求,再转给内网 | 主站 / 与 /api/ |
| 正向代理 | 代表客户端访问外网 | 本 track 不展开(公司出口代理等) |
正向代理:你 → 代理 → 外网网站(网站看见的是代理)
反向代理:你 → Nginx → 内网应用(你看见的是 Nginx 域名)
跟着做
步骤 1:对照官方定位
打开 nginx.org 英文欢迎页 / About,用中文写一句:「Nginx 是高性能 HTTP 与反向代理服务器,也可作邮件代理等。」
再补本课立场:本站主路径把它当公网入口与 TLS 边界,业务仍在 Spring / Next。
应看到:官方强调 HTTP、反向代理、负载均衡,而不是「替代应用框架」。
步骤 2:打开生产配置骨架
在仓库打开 deploy/nginx/prod.conf.example。从上到下找到:
upstream coderoadmap_platform → 127.0.0.1:3000
upstream coderoadmap_backend → 127.0.0.1:8080
listen 80 的 301 跳转块
server_name www.coderoadmap.cn 的 443 主块在笔记写:「公网域名只出现在 Nginx;8080/3000 是本机回环。」
步骤 3:对照两条 location
# /api/ 去掉前缀后转给 Spring Boot
location /api/ {
proxy_pass http://coderoadmap_backend/;
# … proxy_set_header …
}
# 其余路径原样转给 Next.js
location / {
proxy_pass http://coderoadmap_platform;
# … Upgrade 等 …
}
- 浏览器要
https://www…/api/tracks → 进 backend,URI 变成 /tracks
- 浏览器要
https://www…/tracks/nginx-essentials → 进 platform,URI 仍是 /tracks/…
步骤 4:对比 Apache / Caddy(选型感)
| 场景 | Nginx | Apache | Caddy |
|---|
| 高并发静态 / 反代 | 事件驱动,常见生产入口 | 模块多,.htaccess 灵活 | 自动 HTTPS,配置短 |
| 本站 | prod.conf.example | 未采用 | 个人项目可选替代 |
| 与 Spring/Next 搭配 | proxy_pass 路径清晰 | 也能反代,语法不同 | 适合快速上线 |
本站选 Nginx:国内文档与运维案例多、与双 upstream 拓扑成熟、和后续 K8s Ingress-Nginx 概念可对照。
步骤 5:在本站部署链里定位
步骤 6:画一张自己的路径图
浏览器 → Nginx:443 → /api → :8080 → MySQL
→ / → :3000 → fetch /api(同源)
口头说清:为何浏览器调 /api 不跨域——同域同主机,由 Nginx 拆开。
讲清楚要点
- 因为公网只应暴露必要端口,所以生产用 Nginx 听 443,应用绑
127.0.0.1——减少攻击面与证书分散。
- 因为反向代理代表服务端,所以客户端只看见域名,看不见真实 upstream IP/端口——这是安全与运维边界。
- 因为本站 API 与页面技术栈不同,所以按
location 拆到两个 upstream——Java 管 REST,Next 管页面/RSC。
- 因为 Nginx 不做业务校验,所以 JWT、限流策略、课程数据仍在 Spring(及可选 Redis)——门岗不审合同条款。
- 因为配置是声明式路由,所以改流量去向优先改 Nginx,而不是改浏览器里写死的端口——前端继续用相对路径
/api。
- 因为官方能力覆盖静态、反代、负载均衡,所以本 track 会逐课覆盖;本课只钉角色与拓扑——避免一上来堆指令。
- 因为 Ingress 本质也是「按 host/path 转发」,所以学裸机 Nginx 有助于读懂 K8s 入口——见后续 ngx-k8s。
你可能会懵的地方
-
「Nginx 和 Node / Java 谁算 Web 服务器?」
都可能。Next 与 Spring 都能直接听 HTTP;生产常再套一层 Nginx 做 TLS 与统一入口。本站:对外 Web 入口是 Nginx,应用是 upstream。
-
反向代理是不是「偷偷改了我的请求」?
会改:路径可能被 proxy_pass 规则剥离前缀,并补上 X-Forwarded-* 头。目的是让后端知道原始 Host、协议与客户端 IP。细节课见 ngx-proxy。
-
为什么不直接用 Next 反代 API?
可以在开发态用 Next rewrites;生产把 TLS、静态 admin、安全头、多进程入口收敛到 Nginx,运维边界更清晰,也与 prod.conf.example 一致。
-
Caddy 自动 HTTPS,为什么还学 Nginx?
个人项目用 Caddy 很香。本站生产配置、文档与后续 Ingress-Nginx 都以 Nginx 语法为主;学会一份配置,迁移成本最低。
错法对照
| 错法 | 问题 | 正解 |
|---|
| 把 :8080/:3000 映射到公网 | 无统一 TLS/安全头,端口暴露 | 仅 Nginx 对外;应用 listen 本机 |
| 分不清正向/反向代理 | 安全模型反了 | 本站是反向:代表服务端 |
| 以为 Nginx 会校验 JWT | 误以为「过了 Nginx 就登录了」 | 鉴权在 Spring / Sa-Token |
| 浏览器直连不同端口调 API | CORS、cookie 域、证书各一套 | 同源 /api,由 Nginx 分流 |
| 只背名词、不对照真实配置 | 装完不会落地到 prod.conf | 每课对照仓库真实配置 |
自测三问
- 用一句话说明:CodeRoadMap 为什么要 Nginx,而不是让浏览器分别访问 3000 与 8080?
location /api/ 与 location / 分别把流量送到哪个端口?
- 反向代理与正向代理,哪一个是本站公网入口的模型?
小结一句话
Nginx 是 CodeRoadMap 的公网门岗:TLS 与路径分流在此完成,/api 进 Spring Boot,其余进 Next.js。
官方延伸