Open Graph 이해하고 적용하기 (feat. 카카오톡에서 변경이 적용되지 않을 때)

Open Graph란?

어떤 웹페이지든 social graph의 일부분이 될 수 있도록 하는 프로토콜이다.

 

Metadata

<기본>

• og:title : url 공유 시 제목으로 들어가는 영역이다. (카카오톡 공유는 title만 공유된다.)
  
• og:type : object의 type이다. (ex_ video.movie, website)
• og:image : url 공유 시 나타나는 이미지이다.
• og:url : graph에서 id로 쓰이는 url이다.

<선택>

• og:audio, og:video : audio, video 파일의 url이다.
• og:description: object에 관한 설명이다.카카오톡 공유에서는 표시되지 않고 슬랙 공유, 블로그에서는 description까지 표시된다.
• og:site_name : 방대한 웹사이트의 한 부분이라면, 해당 웹사이트의 이름을 표시해준다. 

자세한 옵션은 아래의 공식 사이트를 참고한다.

 

Open Graph 적용

Open Graph metadata를 설정한 후, 사이트 url을 공유해봐도 곧바로 생성되지 않는다.
해당 url을 디버거에 한 번 등록해주어야 하는데, 메타 공유 디버거 에서 Open Graph 생성을 원하는 url을 디버그하면 된다.

metadata를 변경한 후에는 해당 사이트에서 공유 디버거 일괄 무효화 도구에서 캐싱 제거를 하고 다시 디버그해주면 된다. 카카오톡의 경우 자체 캐시로 인해 다시 디버그해도 기존 내용이 표시된다. 그럴 때는 카카오 og clear 사이트에서 캐싱을 초기화해주면 된다.

 

 

참고

https://ogp.me/

Open Graph protocol