root 定义静态资源根目录,try_files 按 $uri、$uri/、/index.html 顺序查找并兜底,二者配合实现精确命中、目录索引和 SPA 路由支持,是 Nginx 静态服务最稳妥方案。

直接用 root 搭配 try_files 是 Nginx 提供静态资源服务最常用、也最稳妥的方式。核心在于:root 定义文件系统起点,try_files 控制“找什么、怎么找、找不到怎么办”,二者配合能兼顾精确命中、优雅降级和 SPA 路由支持。
root 的作用是定位物理根目录
root 指令告诉 Nginx:“所有请求路径,都从这个文件夹开始拼”。比如配置:
root /var/www/myapp;- 用户请求
/static/js/main.js→ Nginx 实际查找/var/www/myapp/static/js/main.js - 用户请求
/about→ 查找/var/www/myapp/about(文件)或/var/www/myapp/about/(目录)
注意:root 后的路径不参与 URL 匹配,它只是“基础盘符”。location 中的路径会被完整追加到 root 后面。
try_files 按顺序试探真实存在性
它不是模糊搜索,而是严格按参数列表逐个检查文件或目录是否存在。典型写法:
try_files $uri $uri/ /index.html;-
$uri:查对应文件(如/contact→ 查/var/www/myapp/contact) -
$uri/:查同名目录(/contact→ 查/var/www/myapp/contact/,再找 index 文件) -
/index.html:全部失败时,内部重定向到该 URI,由 location 再次匹配处理
最后一项必须是 URI(以 / 开头)或状态码(如 =404),不能是相对路径或变量。
SPA 应用必须靠这个组合兜底
Vue/React 等前端项目启用 history 模式后,路由如 /user/profile 并无真实文件对应。靠 try_files 把这类请求“收口”到 /index.html,再由前端 JS 解析路由:
- 用户刷新
/dashboard/settings→ Nginx 找不到该路径下的文件或目录 → 回退到/index.html - 只要
/var/www/myapp/index.html存在,页面就能加载,JS 接管后续路由 - 同时,
/static/css/app.8f3a2b.css这类带 hash 的资源仍能被原样命中(前提是构建输出路径与 HTML 中引用一致)
常见错误与避坑点
- 别在 alias 下用 try_files:alias 替换路径逻辑与 try_files 的拼接机制冲突,极易 404;必须用 root
- root 必须写在 location 外或内,但要确保生效范围正确:如果 server 块已设 root,location 里一般不用重复;若 location 需独立根目录,可覆盖写
-
避免漏掉 $uri/:否则访问目录(如
/blog/)会直接 404,而不是尝试加载/blog/index.html - /index.html 是相对于 root 的路径:不是服务器绝对路径,也不是当前配置文件路径











