Meta Tag 이미지 지정 방법
Meta Tag에 og:image를 이용해 사용자에게 미리보기 이미지를 지정 및 제공할 수있다.
아래는 `https://www.kakaocorp.com/`의 Meta Tag의 og:image 정보이다.
meta content="//t1.kakaocdn.net/kakaocorp/corp_thumbnail/KakaoTalk.png" property="og:image"/KakaoTalk 미리보기(오픈그래프 OG) 이미지 Cache 삭제 방법
최근 사내에서 개발자가 테스트 도중 og:image를 바꿨는데도 불구하고 카카오톡에서 cache가 삭제 되지 않아서 실제 테스트시 어려움을 겪었다.
그래서 KakaoTalk의 Cache를 삭제하는 방법을 찾다가 확인하게 되었다.
KakaoTalk의 Cache는 Client에서 삭제될수 있는게 아니기 때문에 해당 문의가 카카오로 많이 온듯하다.
특히 청첩장을 보내려고 하는 신혼부부들이 많이 요청한것으로 보인다...
인터넷을 신나게 돌아다니던중 Kakao developers 사이트에서 Cache를 Clear하는 기능을 만들놓았다. 아래의 URL로 가서 개발자 그룹에 가입하고 자신의 사이트의 주소를 입력하면 바로 Cache가 Clear되어 카카오톡에서 바로 변경이 된다. 특이한건 다른 사이트의 캐쉬도 삭제가 가능하다. (횟수 제한을 만들어 놨을라나 ... 갑자기 궁금해 진다..)
초기화 방법
1. 카카오 개발자 페이지의 OG 캐쉬 삭제 페이지 접속
2. OG 캐쉬 초기화를 원하는 페이지 주소를 입력
3. URL에 사이트 주소 http:// or https:// 구분하여 입력
4. `초기화`버튼 클릭
https://developers.kakao.com/tool/clear/og
카카오계정 로그인
여기를 눌러 링크를 확인하세요.
accounts.kakao.com
Meta Tag의 표준
추가로 이게 맞는지는 모르겠지만 카카오톡 개발그룹에서 Meta Tag의 룰의 경우의 `/>` 로 끝나야 표준이라고 내용을 확인 하였다.
(사실 나는 웹 개발자가 아니라서 잘 모른다... 미리 보기 이미지가 meta tag의 og:image를 통해서 설정한다는것도 지금 알게 되었다 ;;;;)
확인해 보니 카카오톡 홈페이지도 모두 `/>`로 끝나게 설정이 되어 있다.
아래는 카카오톡 홈페이지의 전체 Meta Tag 정보
<html lang="ko" xml:lang="ko">
<head>
<meta charset="utf-8">
<!-- meta -->
<meta content="website" property="og:type" />
<meta content='kakaocorp.com' property='og:site_name'/>
<meta content='//www.kakaocorp.com/service/KakaoTalk' property='og:url'/>
<meta content='ko_KR' property='og:locale'/>
<meta content='en_US' property='og:locale:alternate'/>
<meta content="카카오톡" property='og:title'/>
<meta content='사람과 세상, 그 이상을 연결하는 카카오톡' property='og:description'/>
<meta content="//t1.kakaocdn.net/kakaocorp/corp_thumbnail/KakaoTalk.png" property="og:image"/>
<meta name="naver-site-verification" content="6171ab3d716f1b32969a13e4f5b9475b2f4dd42c"/>
<!-- //meta -->
'일상의 끄적임' 카테고리의 다른 글
| 가정용 에스프레소 기계 (0) | 2020.12.28 |
|---|---|
| 아이들 책상 추천 (#내돈내산) (0) | 2020.12.21 |
| WANTED Welcome Kit을 받다. (0) | 2020.04.10 |
