페이지가 어떻게 펼쳐지는지 확인하기
OG 미리보기는 어떤 페이지의 링크가 Facebook, X, Slack, Discord, LinkedIn, 카카오톡에서 어떤 카드로 보이는지 공유하기 전에 보여 줍니다. Mocco의 이미지를 쓰지 않는 페이지도 공개된 페이지라면 확인할 수 있습니다.
미리 보기
워크스페이스에서 개발자 → OG 미리보기를 엽니다.
페이지 주소를 입력하고(
https://는 빼도 붙여 줍니다) 미리 보기를 누릅니다.
Mocco는 플랫폼마다 그 크롤러의 사용자 에이전트로 페이지를 한 번씩 가져오므로, 크롤러마다 다르게 응답하는 페이지도 드러납니다. 카드는 플랫폼마다 읽는 태그를 그 플랫폼이 대신 쓰는 순서대로 따라가 만듭니다. 각 항목을 가져온 태그에서 제목, 설명, 이미지를 어느 태그에서 가져왔는지 볼 수 있습니다. 이미지에는 이미지마다 픽셀 크기와 용량이 나옵니다.
카드는 길이, 잘림, 대체 순서를 확인하려고 비슷하게 그린 것이지 각 앱을 그대로 옮긴 것이 아니며, 플랫폼은 예고 없이 규칙을 바꿉니다.
경고
| 경고 | 할 일 |
|---|---|
| 이미지가 없거나 불러올 수 없음 | 공개적으로 불러올 수 있는 URL로 og:image 태그를 넣으세요. |
상대 경로이거나 http://인 이미지 URL | https://로 시작하는 전체 URL을 쓰세요. |
| 이미지 크기 태그가 없음 | 이미지를 불러오기 전에 앱이 카드 자리를 잡을 수 있게 og:image:width와 og:image:height를 넣으세요. |
| 1MB를 넘는 이미지 | 이미지를 줄이세요. 큰 이미지를 건너뛰는 앱이 있습니다. |
| 1.91:1에서 많이 벗어난 비율 | 1200×630을 쓰세요(Mocco의 카드는 이미 이 크기입니다). |
| 카카오톡이 10% 넘게 자름 | 카카오톡은 이미지를 2:1로 보여 줍니다. 중요한 부분은 가운데에 두세요. |
| 크롤러마다 응답이 다름 | 페이지나 CDN이 일부 크롤러에게 다른 상태, 제목, 설명, 이미지를 줍니다. 봇 규칙과 캐시를 확인하세요. |
| 페이지를 읽지 못함 | 크롤러가 페이지를 불러오지 못했습니다. 경고에 이유가 나옵니다. |
| 제목이나 설명이 없음 | og:title과 og:description을 넣으세요(적어도 <title>과 meta description). |
한도
워크스페이스마다 1분에 10번, 하루에 100번까지 미리 볼 수 있고, 이 한도는 워크스페이스의 모든 사람과 에이전트가 함께 씁니다. 1분 안에 같은 주소를 다시 미리 보면 직전 결과를 보여 주고 횟수에 포함하지 않습니다. Mocco는 일반 웹 포트의 공개 주소만 가져오고, 리디렉션은 3번까지 따라가며, 5초가 지나거나 페이지가 1MB, 이미지가 5MB를 넘으면 멈춥니다.
에이전트에서
MCP 도구 mocco_og_preview는 같은 미리보기를 실행하고 같은 카드, 이미지, 경고를 알려 줍니다. 아무것도 바꾸지 않으므로 확인을 묻지 않고, 워크스페이스의 한도를 함께 씁니다. Mocco를 에이전트에 연결하기를 참고하세요.