IIS上托管的SPA Angular显示的社交共享元标签

Question

我在IIS上托管了SPA AngularJS应用程序。问题是显示由ngMeta (https://github.com/vinaygopinath/ngMeta)生成的meta标记。我没有任何服务器端应用程序(只有提供数据的ASP.NET网络应用程序接口)。有没有可能让我的网站“社交友好”，而不需要任何服务器端的预渲染？

现在它看起来像是here

Answer 1

您可以设置备用的静态HTML标签，当Angular可用时(使用ng-if)这些标签将被移除。

<title ng-bind="ngMeta.title">Fallback title</title>
<meta name="description" content="Fallback description" ng-if="false" />
<meta name="description" content="{{ ngMeta.description }}" />

社交媒体爬虫通常不会执行Javascript，所以他们会看到Fallback description，而谷歌的支持Javascript的爬虫会获取ngMeta.description设置的描述。

请注意，上面的代码提供了站点范围的标题、描述和其他元标记。如果想要根据路径自定义meta标签值，可以执行以下操作

1. 标识请求到服务器的用户代理
2. 如果用户代理与已知的social media crawler's user agent字符串匹配，则重定向到脚本，而不是提供文件。
3. 检查请求的路由(例如，/blog)，并返回或生成具有与博客页面相关的元标记的HTML页面。