angular - 如何在 Angular 2 中实现 SEO(Metatags)(在服务器端使用 Angular 通用渲染)？

Question

我正在搜索一个关于使用 Angular 2 的 SEO 或 Metatags 的完整工作示例，使用 Angular universal 在服务器端呈现(以被 facebook、twiter 和其他 metatags 识别)，但我没有成功..

我找到了多篇文章，但有不完整的(没有所有源代码可用)或最旧的(没有用最新版本编译):

a) blog.devcross.net/2016/04/17/angular-2-universal-seo-friendly-website/注意:带有源代码的优秀帖子，但它不起作用。

b) builtvisible.com/universal-angular-2-server-side-rendering-seo-crawl-friendliness/注意:非常有用，但没有源代码完整的源代码..

c) https://gist.github.com/kaaboeld/851bc3190eec67f6723c6054751ee2dc

注意:不是完全有效的示例。可能是最好的方法..

d) https://github.com/angular/universal/issues/454注意:它是 c 选项的变体，有一些修复...

您有任何完整的工作示例吗？

提前致谢

Answer 1

看看这个Universal-starter repo 。在其他一些很棒的东西中，您可以找到 angular-meta.ts处理服务器端所有元标记的服务。您将需要按照 this issue 中所述进行一些小的更改。为了使 t 工作。我认为这个解决方案仍然需要一些改进(例如，它在尝试更新时添加了另一个重复标签，但我相信可以修复)

可以找到类似的服务here ，还没有尝试过，但看起来它与之前的概念相同，并且还利用了 Angular 的 Title 服务来设置页面标题。

更新

同时检查 This修复了 angular2-meta 服务。