你在开发网页或者调试接口的时候,突然发现客户端请求返回404,页面打不开,接口调不通,这时候别急,404虽然常见,但问题出在哪得一步步排查。
先确认是不是地址写错了
最常见的原因就是URL拼写错误。比如你想请求 /api/user/list,结果手一抖写成了 /api/user/lisst,服务器当然找不到。检查一下路径有没有多字母、少斜杠、大小写不对等问题。尤其是Linux服务器对大小写敏感,/User 和 /user 是两个路径。
看看后端服务起来了没有
有时候你本地启动前端项目,但后端服务压根没运行。比如你前端请求 http://localhost:8080/api/data,但后端服务监听的是 3000 端口,或者根本没启动。打开终端,确认后端服务是否正常运行,端口是否正确绑定。
检查路由配置有没有问题
如果你用的是 Express、Koa、Spring Boot 这类框架,可能是路由没注册。比如在 Express 中写了:
app.get('/users', (req, res) => {
res.json({ list: [] });
});
但你实际请求的是 /user,那肯定404。核对代码里的路由定义和你请求的路径是否一致。
静态资源部署路径别搞混
前端打包后扔到服务器,经常出现 index.html 能打开,但点进去其他页面就404。这通常是因为用了 history 模式路由,但服务器没配置 fallback 到 index.html。比如你在 Nginx 里要加上:
location / {
try_files $uri $uri/ /index.html;
}
这样即使路径不存在,也会返回首页,交给前端路由处理。
代理设置可能挡了路
开发时用 Vue 或 React 的 proxy 功能转发请求,但如果配置不对,也可能导致404。比如你设了代理到 http://api.example.com,但目标服务根本没有 /v1/data 这个接口,那转发过去还是404。打开浏览器开发者工具,看实际请求发到了哪个地址,响应是什么。
线上环境路径和开发环境不一样
本地测试好好的,一上线就404,很可能是路径前缀变了。比如生产环境接口统一加了 /prod-api 前缀,但你前端还往 /api 发。检查一下环境变量或配置文件,确保请求地址匹配当前环境。
缓存也可能是“凶手”
有时候改完代码刷新还是404,其实是浏览器或者CDN缓存了旧的404响应。试试无痕模式打开,或者清掉缓存再请求。如果是CDN问题,可能需要手动刷新节点缓存。
404不是世界末日,关键是要顺着请求链一路查下去:地址对不对、服务在不在、路由配没配、服务器怎么处理静态资源、有没有中间层干扰。一个个排除,问题自然就浮出水面了。