Angular 8 站点地图和 robots.txt答案

【问题标题】：Angular 8 sitemap and robots.txtAngular 8 站点地图和 robots.txt
【发布时间】：2020-04-21 20:29:37
【问题描述】：

我使用 Angular 8 创建了一个 Angular 应用程序。我正在努力在 Google 上引用我的网站。我在项目的路径中添加了一个 sitemap.xml 和 robots.txt 但是当我尝试通过这样做访问浏览器中的文件时：

https://blablawebsite.fr/sitemap.xml

路由模块正在拾取路由，找不到页面。如何确保路由模块没有选择 sitemap.xml 和 robots.txt？

【问题讨论】：

尝试将这些文件放在 dist 输出目录的 assets 文件夹中

标签： angular seo

【解决方案1】：

与我对接受的答案的理解相反，tt 不需要为您的项目添加 Angular Universal，只是为了添加 sitemap.xml 或 robots.txt。

正如@David 在他的评论中更简洁地说，你需要做的就是：

将文件添加到 /src 中的项目（favicon.ico 旁边）
将它们添加到项目中>architect>build>options>assets 在您的 angular.json 中，如下所示：

 "assets": [
                  "src/favicon.ico",
                  "src/assets",
                  "src/robots.txt",
                  "src/sitemap.xml"
                ],

更详细的解释here。

添加。备注：

确保您不会仅在 angular.json 中意外捕获“测试”资产，它们会在浏览文件时更早出现
如果您的 robots.txt 文件无效的警告不再出现在 Chrome 开发工具中 Lighthouse 报告的 SEO 部分下方，您可以验证 Google 现在可以识别您的 robots.txt
然而，确实，即使使用 robots.txt，除了 Google 之外的搜索引擎也不能很好地处理没有服务器端渲染的 Angular SPA（例如通过 Angular Universal）。甚至谷歌在这方面的能力也存在争议。这个guy 解释得很好。
我的回答适用于 Angular 10 和 11，其他版本我不知道

【讨论】：

【解决方案2】：

使用Angular Universal 和Cloud Functions for Firebase 来托管，我将sitemap.xml 和robots.txt 放在src 内。然后在angular.json 内"assets" 中添加它，如下所示：

...
"assets": [
  "APP_NAME/src/robots.txt",
  "APP_NAME/src/sitemap.xml",
],
...

效果很好:)

【讨论】：

【解决方案3】：

您需要首先考虑将您的项目转换为 Angular Universal。 Google 和其他搜索引擎机器人不能也不会在您的应用中导航，因为所有这些都是事后发生的。

从这里开始：https://angular.io/guide/universal

在意识到网站和 SPA 之间的区别之前，很多人误解了所有这些是如何工作的，并且在他们的项目中走得很远。没什么大不了的，你仍然可以让你的 Angular 应用程序在服务器端渲染中排名

【讨论】：