카카오톡으로 링크 공유시 오픈 그래프 이미지 안 나올 때 (공유 디버거 사용하기)

※ 오픈그래프 설정하는 법

[HTML] 링크 공유 시 미리보기 썸네일 설정하기 (meta 태그)

프로젝트를 하던 중, SNS로 링크 공유 시 미리보기 화면을 꾸미고 싶다는 기획자의 의견을 받아 이를 반영하게 되었다. 넣을 수 있는 것들은 크게 4가지가 있다. 1. 썸네일 이미지 2. 썸네일 제목 3.

inner-stella.tistory.com

오픈그래프를 설정하면서 테스트하는 과정에서 카카오톡으로 링크를 보내다보면,

변경 사항이 제대로 반영되지 않는 경우가 있다.

이는 카카오톡에 이미 해당 링크에 대해 캐싱되기 때문인데, 이를 해결하기 위해서는

카카오톡 개발자 도구 사이트에서 해당 링크에 대한 캐시를 초기화해주면 된다.

카카오계정

accounts.kakao.com

카카오톡 채팅창 또는 카카오스토리에 공유된 소셜 정보를 OG(Open Graph) 프로토콜을 통해 파싱하고 캐시합니다. 이 도구로 파싱된 소셜 정보를 미리보고 캐시를 초기화할 수 있습니다.

오픈 그래프가 실제로 어떻게 적용되는 지 확인해보려면, 위의 창에서 디버그 버튼을 누르면 볼 수 있다.

웹 접근성 높이기 w/ 기존 프로젝트 리팩터링 (Lighthouse) (0)	2024.01.02
Google 소셜 로그인 과정 (OAuth) (0)	2023.10.22
배포 후 React-flask cors 해결하기 (react proxy는 소용 없음) (0)	2023.04.03
Mixed Content : This request has been blocked; the content must be served over HTTPS. (0)	2023.04.03
브라우저의 동작과정 (0)	2023.01.27

halfplastic