Facebook开放图谱和AngularJS

Question

我正在开发一个AngularJs应用程序，并希望为其添加开放图谱功能。我希望用户能够与他们的Facebook好友分享URL。我理解，要使共享生效，您需要向页面添加开放图谱元数据标签（网址、描述、图片、标题等）。我需要用户分享的URL是动态的，它具有以下结构：http://example.com/game/invitation/1118，其中1118是要分享的游戏ID。下面的文章介绍了如何在Angular应用程序中启用社交共享：http://www.michaelbromley.co.uk/blog/171/enable-rich-social-sharing-in-your-angularjs-app。然而，该文章指出Facebook爬虫无法呈现动态内容。因此，当Facebook爬虫访问http://example.com/game/invitation/1118时，我需要重定向请求到我的服务器以生成适当的开放图谱元标记。我使用的是IIS（本文说明了如何通过Apache执行此操作）。这是我的重写规则：

    <rule name="Imported Rule 1" stopProcessing="true">
        <match url="invitation/([_0-9a-z-]+)" ignoreCase="false" />
        <conditions>
            <add input="{HTTP_USER_AGENT}" pattern="facebookexternalhit/[0-9]|Twitterbot|Pinterest|Google.*snippet" />
        </conditions>
        <action type="Redirect" url="http://meta.example.com/social/meta/{R:1}" appendQueryString="false" />
    </rule>

因此，每当一个url包含invitation/[游戏id]并且用户代理是Facebook（或Twitter、Pinterest、Google等），请将它们重定向到"http://meta.example.com/social/meta/[id]"。这个功能很好。我设置了一个单独的网站(http://meta.example.com)来呈现开放图谱元标记以供爬虫索引。

问题在于，我需要使用http://example.com/game/invitation/1118作为og:url元标记的值（这是用户的朋友点击查看邀请的链接，我的大多数用户的朋友不会是Facebook的爬虫）。如果我包括

<meta property="og:url" content="http://example.com/game/invitation/1118" />

在生成页面中http://meta.example.com/social/meta/1118，然后我在Facebook的Open Graph Object Debugger中收到循环引用错误。Facebook的爬虫从http://meta.example.com/social/meta/1118生成的meta标签中提取标题、描述等。然而，它似乎从og：url meta标签中提取http://example.com/game/invitation/1118并重新运行它。据我所知，这会导致一个循环引用。

那么，当用户代理是Facebook时，如何配置IIS将对http://example.com/game/invitation/1118的请求重定向到http://meta.example.com/social/meta/1118以生成适当的开放图元标记并重用启动此过程的原始URL（http://example.com/game/invitation/1118）？

上面的文章（http://www.michaelbromley.co.uk/blog/171/enable-rich-social-sharing-in-your-angularjs-app）提到了如何在Apache中实现此目的。我不知道如何将其翻译成IIS：

引用：

[P]标志导致Apache使用mod_proxy和   mod_proxy_http进行重映射，而不是常规重定向。如果使用301重定向，   例如Facebook将链接到“static-page.php” URL   而不是原始URL。

感谢您的帮助。我正在使用IIS 8。

- Tom Schreck

---

嗨Tom！请告诉我在AngularJS应用程序中添加Open Graph功能的当前技术是什么。我正在使用Node.js和Express。 - Nirmal Bajpai

Answer 1

替代重定向操作：

<action type="Redirect" url="http://meta.example.com/social/meta/{R:1}" appendQueryString="false" />

你应该使用Rewrite动作：

<action type="Rewrite" url="/social/meta/{R:1}" appendQueryString="false" /> 

请注意，您应该在同一域上使用相对路径。

- Ers