facebook open graph 및 AngularJs

Question

저는 개발중인 AngularJs 앱에 열린 그래프 기능을 추가하려고합니다. 내 앱 사용자가 Facebook 친구들과 URL을 공유하기를 원합니다. 작동하도록 공유하기 때문에 페이지에 열린 그래프 메타 데이터 태그 (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 크롤러가 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] 초대 /를 포함하고 사용자 에이전트가 페이스 북 (또는 트위터, 클립 서비스, 구글 등) 때마다,이 "http://meta.example.com/social/meta/[id]"리디렉션. 이것은 훌륭하게 작동합니다. 별도의 웹 사이트 (http://meta.example.com)를 설정하여 크롤러가 색인을 생성 할 수 있도록 열린 그래프 메타 태그를 렌더링했습니다.

og : url 메타 태그 값으로 http://example.com/game/invitation/1118을 사용해야합니다.이 링크는 초대장을보기 위해 사용자의 친구가 클릭하는 링크이며, 내 사용자의 친구 대부분은 Facebook 크롤러가 아닙니다. 내가 http://meta.example.com/social/meta/1118에서 생성 된 페이지에

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

을 포함 할 경우, 나는 페이스 북의 오픈 그래프 개체 디버거의 순환 참조 오류를 얻을. Facebook의 크롤러는 http://meta.example.com/social/meta/1118에서 생성 된 메타 태그에서 제목, 설명 등을 선택합니다. 그러나 og : url 메타 태그에서 http://example.com/game/invitation/1118을 찾아 다시 다시 실행하는 것으로 보입니다. 이것은 내가 말할 수있는 것을 순환 참조로 만듭니다. 사용자 에이전트는 페이스 북이 프로세스 (http://example.com/game/invitation/1118)를 시작 원래 URL을 해당 오픈 그래프 메타 태그를 생성하고 재사용하기 위해 때

그래서, 당신은 어떻게 http://meta.example.com/social/meta/1118에 http://example.com/game/invitation/1118에 대한 요청을 리디렉션하도록 IIS를 구성합니까?

위의 기사 (http://www.michaelbromley.co.uk/blog/171/enable-rich-social-sharing-in-your-angularjs-app)에는 Apache에서이 작업을 수행하는 방법이 나와 있습니다. 나는 IIS에이 번역하는 방법을 모른다 :

에서 [P] 플래그는 아파치가 아니라 일반 리디렉션보다 mod_proxy를하고 mod_proxy_http가를 사용하여 다시 매핑을 수행하게됩니다. 301 리디렉션이 인 경우 Facebook은 원래 URL이 아닌 "static-page.php"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" /> 

메모를 당신 당신이 동일한 도메인에 상대 경로해야한다.