카테고리 없음

카카오톡·페이스북 OG 데이터 캐시 삭제하는 방법

이재협 2021. 1. 23. 10:03

카카오톡·페이스북 OG 데이터 캐시 삭제하는 방법

웹 개발 시 발생할 수 있는 OG 데이터가 갱신되지 않는 문제와 그 해결책에 대한 글입니다.

캐시로 인해 발생하는 문제점

https://physia.kr의 index.html에는 다음과 같은 메타 태그가 있습니다.

<meta property="og:title" content="피시아 (PHYSIA)" />
<meta property="og:image" content="t1.png" />

 

이대로 사이트 링크를 페이스북에 공유하면 페이지 제목은 "피시아 (PHYSIA)", 썸네일 이미지는 "t1.png"으로 표시됩니다.

 

<meta property="og:title" content="피시브 (PHYSIB)" />
<meta property="og:image" content="t2.png" />

 

그런데 이렇게 메타 태그의 내용을 변경했는데도 불구하고, 새로운 채팅이나 게시글에 공유하면 썸네일에 여전히 "피시아 (PHYSIA)", "t1.png"으로 나타나는 것을 확인할 수 있습니다.

이는 카카오톡·페이스북 등 SNS에서 링크를 공유하면 해당 URL에 대한 메타 데이터를 자체 서버에 캐싱 함으로 인해 발생하는 현상입니다. 이러한 캐싱 절차 덕분에 서버에서는 매번 새로 갱신하지 않아도 된다는 장점이 있지만, 어떤 변경사항을 적용했을 때에도 갱신이 되지 않아 반영되지 않는 상황도 발생하는 것입니다.

해결책

이 문제를 어떻게 해결하면 좋을까요? 다행히도 웬만한 SNS에서는 웹 개발자를 위해 URL에 대한 캐시 데이터를 직접 초기화할 수 있는 도구를 제공하고 있습니다.

카카오톡

developers.kakao.com/tool/clear/og에서 간단한 방법으로 OG 캐시를 초기화 할 수 있습니다.

Kakao Developers

 

페이스북

developers.facebook.com/tools/debug에서 마찬가지로 아주 심플하게 URL 캐시를 초기화 할 수 있습니다.

FACEBOOK for Developers

 

마무리

개발 업무를 할 때 간혹 변경사항을 적용했음에도 불구하고 OG 캐시가 여전히 남아 있어 피드백을 받지 못하는 경우가 있습니다. 열심히 업데이트 한 내용인데 상대방이 확인을 못 한다고 하면 나는 억울하고 상대방은 답답하겠죠? 그러니 변경 사항을 적용할 때마다 잊지 않고 캐시를 초기화해줍시다! 한편으로는 개발자를 배려한 캐시 초기화 도구가 제공되고 있다는 건 다행인 점입니다. 

저작자표시 비영리 변경금지 (새창열림)