Linux服务器上Apache和Nginx默认区分URL路径大小写,/page.html与/Page.html被视为不同资源;HTML中href/src必须与实际文件名大小写完全一致,否则返回404。

Apache 默认区分路径大小写
Linux 服务器上的 Apache 默认严格区分 URL 路径大小写,/page.html 和 /Page.html 被视为两个不同资源。如果 HTML5 页面里写的是 ,但实际文件名是 about.html,点击后直接返回 404。
常见错误现象:Failed to load resource: the server responded with a status of 404 (Not Found),尤其在本地开发(Windows/macOS)能打开,一上 Linux 服务器就挂。
- 检查服务器文件系统:用
ls -l确认真实文件名大小写是否与 HTML 中的href、src完全一致 - 避免依赖“碰巧能通”:不要指望服务器自动纠错或重定向,除非你明确配置了规则
- CI/CD 流程中可加入校验脚本,比对 HTML 内所有
href和src值是否对应真实文件(注意路径解析逻辑)
Nginx 不支持内置大小写忽略,得靠重写
Nginx 本身不提供类似 Apache 的 mod_speling 模块,也没有开关式“忽略大小写”选项。必须手动用 rewrite 或 try_files 拆解处理,否则请求直接失败。
典型做法是用正则匹配常见静态资源后缀,尝试小写化再查找:
立即学习“前端免费学习笔记(深入)”;
location ~* \.(html|htm|js|css|png|jpg|jpeg|gif|ico|svg)$ {
try_files $uri $uri.html $uri.htm $uri.js $uri.css
/$1$2$3$4$5$6$7$8$9.html
/$1$2$3$4$5$6$7$8$9.htm
=404;
}更稳妥的方式是统一强制小写——在 server 块里加:
if ($request_uri ~ "^[^A-Z]*[A-Z].*$") {
return 301 $scheme://$host${request_uri,,};
}⚠️ 注意:${request_uri,,} 是 Nginx 1.11.8+ 支持的变量小写语法,低版本需用 Lua 或外部脚本补位。
HTML5 单页应用(SPA)路由要额外防 404
Vue Router、React Router 等前端路由默认用 history 模式,URL 看似正常(如 /user/profile),但刷新时服务器会按路径找真实文件——而这个路径根本不存在,导致 404。
这不是大小写问题,但常被混淆。解决核心是:让服务器把所有非静态资源请求都 fallback 到 index.html。
- Apache:在
.htaccess加FallbackResource /index.html或重写规则 - Nginx:在
location /块内用try_files $uri $uri/ /index.html; - 关键点:这条规则必须放在静态资源 location 之后,否则图片/CSS 也会被 fallback,造成 404 连环错
开发阶段就该锁定大小写习惯
等上线才发现大小写不一致,往往意味着项目已混用多种命名风格,修复成本高。最省事的做法是从第一天就定死规范。
推荐策略:
- 所有 HTML、JS、CSS 文件名强制小写 + 连字符(
user-profile.html),禁止驼峰和大写首字母 - 编辑器启用“保存时自动小写文件名”插件(如 VS Code 的
file-header类扩展可配合脚本) - Git 提交前跑一次检查:
git ls-files | grep '[A-Z]',有输出就提醒修正 - 注意 Windows 开发者容易忽略:NTFS 默认不区分大小写,但 Git 仓库仍会记录大小写变更,push 到 Linux 服务器就暴露问题
大小写不是“要不要区分”的选择题,而是“服务器怎么对待它”的事实。Linux 文件系统、主流 Web 服务器、CDN 缓存节点,几乎全都区分——接受这点,比试图绕过它更可靠。











