如何使用正确的状态码配置 Angular/nginx 路由答案

【问题标题】：How to configure Angular/nginx routing with proper status codes如何使用正确的状态码配置 Angular/nginx 路由
【发布时间】：2022-01-25 13:33:26
【问题描述】：

我正在努力寻找有关如何在 Angular 和 Nginx 中设置路由以支持以下逻辑的任何好的文档或指南：

Route                            File       Status

example.com                   -> index.html 200 OK
example.com/path              -> index.html 200 OK
example.com/not-found         -> index.html 404 NOT FOUND
example.com/another-not-found -> index.html 404 NOT FOUND

要点：

刷新页面应该得到相同的结果
转到不存在的路径不应重定向，它应提供 404 状态代码并显示 404 页面。

有没有办法做到这一点？任何帮助将不胜感激。

【问题讨论】：

标签： angular nginx url routes http-status-code-404

【解决方案1】：

似乎不可能让 Angular 以这种方式工作。以 Angular 文档为例，他们也不这样做。

尽管 Google 自己说这是一种不好的做法：https://developers.google.com/search/docs/advanced/crawling/soft-404-errors

幸运的是，这不是一个大问题，因为 Google 确实会尝试将状态为 200 的页面识别为 404，只要页面上的内容足够清楚地表明它实际上是 404。

在 Angular 文档源代码中可以看到一项 SEO 改进：

// Dynamically, pre-emptively, add `noindex`, which will be removed when the doc is ready and valid
const tag = document.createElement('meta');
tag.name = 'robots';
tag.content = 'noindex';
document.head.appendChild(tag);

这会将<meta name="robots" content="noindex"> 添加到所有页面。一旦他们知道页面是有效的（即不是 404），他们就会删除这个标签。

【讨论】：