root 定义静态文件根目录,try_files 在 location / 中协同实现 spa 路由:root 指向构建产物父目录,try_files $uri $uri/ /index.html 依次匹配真实文件、目录、兜底至 index.html;需配合 index index.html 声明默认页,并前置 location /api/ 和静态资源正则规则避免误兜底。

用 root 指令配合 try_files 实现单页应用(SPA),关键不是单独配对,而是让两者在 location / 块里协同工作:root 定义静态文件查找起点,try_files 决定“找不到时怎么办”。
root 要指向构建产物的上层目录
比如你的 Vue 或 React 项目执行 npm run build 后,生成的 index.html、js/、css/ 等全在 /var/www/my-spa/ 下,那么:
-
root /var/www;—— 指向my-spa的父目录 - 再配合
location / { ... },Nginx 就会把请求/js/app.js映射为/var/www/my-spa/js/app.js - 如果写成
root /var/www/my-spa;,那/js/app.js会被查成/var/www/my-spa/js/app.js,也能通,但扩展性差(比如加子路径时容易出错)
try_files 必须放在 location / 块里,顺序不能乱
只写这一行:try_files $uri $uri/ /index.html;
Linux 性能分析与调优专家,覆盖 CPU、内存、磁盘 I/O、网络、内核参数、编译优化、容器/K8s。适用场景:系统卡顿/高负载、内存不足/OOM/Swap 高、CPU 异常/iowait 高。
-
$uri:查真实文件,如/favicon.ico、/logo.png,存在就直接返回 -
$uri/:查真实目录,如/assets/,存在且配了index index.html;才能生效 -
/index.html:前两项都失败时,内部重写到根目录下的index.html(不是跳转,URL 不变)
必须显式声明 index 和 root 配合生效
这三者要一起出现,缺一不可:
root /var/www/my-spa;-
index index.html;—— 防止某些请求(比如访问/末尾不带斜杠)因没默认页而 fallback 失效 try_files $uri $uri/ /index.html;
不加 index,访问 /admin/ 这类目录路径可能返回 403 或 404,而不是自动加载 index.html。
别让 API 或静态资源被兜底误伤
try_files 是“兜底”,但不该兜底所有请求。需提前拦截两类关键路径:
- 后端接口:用独立
location /api/块,写在location /之前,确保/api/login直接代理,不进 try_files 流程 - 静态资源:用正则
location ~* \.(js|css|png|jpg|woff2)$提前匹配并设置缓存,避免哈希文件(如app.a1b2c3.js)被错误返回index.html










