必须返回HTTP 404状态码，否则影响SEO和用户体验；Apache用ErrorDocument 404 /404.html（静态）或PHP中加http_response_code(404)，Nginx配error_page 404 /404.html，Next.js默认pages/404.js自动返回404，验证需查Network中Status是否为404 Not Found。
404 页面不是“随便写个提示就行”，它必须返回 HTTP 404 状态码，否则对 SEO 和用户体验都是负向影响。
如何确保服务器真正返回 404 状态码
很多开发者只在 HTML 里写“页面未找到”，但浏览器地址栏仍是 200 OK —— 这说明服务器根本没发 404 响应。关键不在前端渲染，而在服务端配置或动态脚本的显式声明。
- Apache：在
.htaccess中设置ErrorDocument 404 /404.html，且/404.html必须是静态文件（不经过 PHP/Node 渲染）；若用 PHP 动态生成，开头必须加http_response_code(404) - Nginx：在 server 块中配置
error_page 404 /404.html;，并确保该路径下文件存在且无重定向（比如不要写成/404.html?ref=xxx） - Next.js / Vercel：默认
pages/404.js会自动返回 404 状态；但若你在getServerSideProps中抛错或重定向，可能被降级为 200 - 验证方式：打开 DevTools → Network 标签，刷新一个明显不存在的路径（如
/nonexistent-abc123），看响应头中Status是否为404 Not Found
为什么不能用 JavaScript 跳转或单页路由模拟 404
客户端跳转（如 window.location.href = '/404'）或 React Router 的 <Navigate to="/404" /> 只改了 URL 和内容，HTTP 状态码仍是 200。搜索引擎爬虫不会把它当错误页处理，用户也无法通过浏览器“返回”回到上一页（因为历史记录里没有真实 404）。
- SPA 应用（如 Vue Router、React Router）必须配合服务端 fallback 配置：Nginx 的
try_files $uri $uri/ /index.html;是常见写法，但它会让所有 404 请求落到index.html，所以你得在 JS 里手动判断路径并调用history.replaceState(null, '', '/404')+ 渲染对应组件 —— 但这仍无法改变状态码，仅作视觉补救 - 真正合规的做法：服务端识别无效路径后，直接响应 404 + 自定义 HTML，不走前端路由
404 页面里哪些链接和行为容易踩坑
404 页面本质是“已失败”的上下文，任何可能引发二次请求或误导用户的交互都需谨慎。
立即学习“前端免费学习笔记（深入）”；
- 避免在 404 页面中嵌入
<script src="https://cdn.example.com/analytics.js"></script>：第三方脚本加载失败或超时会拖慢页面可交互时间，而用户此时已经受挫 - 搜索框如果提交到
/search?q=xxx，请确保该接口本身有容错（比如返回空结果而非又一个 404） - 首页链接应使用绝对路径
<a href="/">首页</a>，而非相对路径<a href="..">—— 当前 URL 是/blog/post/123/missing时，..会跳到/blog/post/，不是预期行为 - 不要自动播放视频、弹窗订阅框或触发 GA 事件：这些行为违反 WCAG 2.1 的“中断控制”原则，且对屏幕阅读器用户极不友好
要不要加“返回上一页”按钮？怎么加才安全
可以加，但不能依赖 history.back() —— 它在用户从外部链接直接进入 404 时会失效（history.length === 1），导致空白或报错。
- 更稳妥的方式是读取
document.referrer并做白名单校验：if (document.referrer && document.referrer.startsWith('https://yourdomain.com')) { /* 显示返回链接 */ } - 始终提供一个明确的备用出口，比如
<a href="/">回到首页</a>，这是唯一 100% 可靠的导航锚点 - 不要用
<button onclick="history.back()">，而要用<a href="javascript:history.back()">或更优解：CSS 隐藏按钮，JS 检测 referrer 后再显示并绑定事件
最常被忽略的一点：404 页面的 <title> 必须包含 “404” 字样，且放在 <head> 最前面。很多 CMS 默认复用首页 title，导致 Google 搜索结果中显示“我的博客 - 首页”，而不是“页面未找到 - 我的博客”。
