facebook开放图和AngularJs

Question

我正在尝试在我正在开发的AngularJs应用程序中添加开放图形功能。我希望我的应用程序的用户与他们的Facebook好友共享一个URL。我理解共享工作，您需要添加打开图形元数据标签到页面(网址，描述，图像，标题等)。我需要用户共享的URL是动态的，具有以下结构：

http://example.com/game/invitation/1118

其中1118是游戏的Id要共享。下面这篇文章描述了如何在一个有角度的应用程序中实现社会共享：

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包含游戏的邀请/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的中的循环引用错误。Facebook的爬虫是从http://meta.example.com/social/meta/1118生成的元标记中挑选标题、描述等。但是，它似乎从og:url标记中选择了http://example.com/game/invitation/1118并再次运行它。据我所知，这会引起一个循环引用。

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

上面的文章(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。

Answer 1

而不是重定向行动：

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

您应该使用重写操作：

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

请注意，您应该在同一域上创建一个相对路径。