OG 동적 생성 관련 문의드립니다

Scrap(미리보기, 스크랩)
1

문의 시, 관련 URL 또는 디벨로퍼스 앱ID를 알려주세요.

안녕하세요. 웹 페이지 개발 중에 아래와 같이 URL 뒤에 params 를 받아 동적으로 meta tag를 생성하고 있는데
네이버 밴드의 채팅창에 해당 URL을 올리면 정상적으로 노출되는 것이 확인 되었습니다.
어떤 문제가 있는 것인지 확인할 수 있을까요?

url :

http://us.dev.mozzle.co.kr/moim/share/?MD=362&MN=%ED%8F%AC%EC%BC%93%EB%AA%AC%20%EB%A7%88%EC%8A%A4%ED%84%B0%20%EB%AA%A8%EC%9E%84&MI=http%3A%2F%2Fapi.dev.mozzle.co.kr%2Fstore%2F2023%2F07%2F08%2Feb385be0c0ed40d9b23585204e894b5a.jpeg&TI=%27%ED%83%95%ED%9B%84%EB%A3%A8%20%EC%97%B4%ED%92%8D%27%20%EC%9D%B4%EB%A9%B4%EC%97%94%20%EB%81%88%EC%A0%81%ED%95%9C%20%EA%B8%B8%EA%B1%B0%EB%A6%AC%E2%80%A6%22%EC%93%B0%EB%A0%88%EA%B8%B0%20%EA%B3%A0%EB%AF%BC%22&RD=%2Fmoim%2F55%2Fcommunity%2Fboard%2F362
2

안녕하세요.

아쉽지만, og 태그는 백앤드에서 랜더링 부탁드립니다.
카카오 스크랩서버는 JS에 의한 클라이언트 랜더링을 지원하지 않습니다.

3

답변 감사합니다! 혹시 백앤드에서 랜더링 관련하여 가이드가 있을까요?
현재 개발하는 프로젝트는 create-react-app 을 사용한 SPA 클라이언트 사이드 랜더링 프로젝트 입니다.
백앤드 랜더링을 위해 react-helmet-async, react-snap 이란 라이브러리를 사용하여 meta tag를 변경하고 있는데 해당 라이브러리를 사용하여 tag를 변경하는 것은 소용이 없을까요?

4

아쉽지만, 관련하여 별도 가이드는 없습니다.
서버 사이드에서 랜더링 하셔야 하며, 이를 위해 react-snap을 사용하셔도 괜찮습니다.

다만, 사이트 접근 시 meta tag가 보이지 않는것으로 보아 react-snap가 적용 되지 않은것으로 보입니다. 또한 파라미터를 받아 동적으로 meta tag를 관리하기에 이와 같은 방식으로 react-snap이 정상동작 하기는 어려울것 같습니다.

동적이 아닌 정적인 값으로 프리랜더링 하시거나, nextjs처럼 서버 사이드에서 랜더링 가능한 프레임워크를 사용하시는게 좋을것 같습니다.