twitter card with csr

twitter card with csr

Twitter card

twitter나, sns, 메신저에 post를 공유할때 대표사진과 함께 타이틀이 보여지게 된다.

이게 CSR(SPA)에서 가능할까?

 

CSR에서는 react-helmet이나, document를 사용해 html header의 meta tag등을 변경하게 된다.

 

Javascript bot

CSR에서 업데이트된 meta 태그를 읽을려면, sns플랫폼에서 javascript 로딩을 지원해야 한다.

하지만, 대부분 javascript로딩을 지원하지 않고 있다.

 

CSR에서 react-helmet을 사용해 twitter card를 적용 했다는 댓글을 보고, 

하루 동안 삽질한 결론이다.

 

SSR

결론은 SSR로 적용이다.

twitter card에서 CSR로 적용이 되었다고 해도, 다른 메신저나 플랫폼에서는 Javascript loading이 지원되지 않고 있다.

공유는 중요하기 때문에 SSR로 다시 갈아탄다.