OG 이미지 생성기

파라미터를 설정하고 Signed URL을 만들어 HTML에 바로 붙여넣으세요.

이미지 파라미터

제목 *

부제목

텍스트 정렬

테마

폰트

포맷

플랫폼 / 사이즈

너비

높이

Signed URL에 사용할 API Key

불러오는 중...

미리보기

데모 워터마크 포함

제목을 입력하면 미리보기가 표시됩니다

서버사이드 서명 (개발자용)

백엔드에서 직접 서명하려면 아래 코드를 참고하세요. Secret Key는 API Key 발급 시 한 번만 표시됩니다.

const crypto = require('crypto');

function signOgUrl(secretKey, params) {
  const ts = Math.floor(Date.now() / 1000).toString();
  const kid = 'YOUR_KEY_ID'; // Dashboard에서 복사

  const signable = { ...params, ts, kid };

  // 알파벳 순 정렬 후 canonical string 생성
  const canonical = Object.entries(signable)
    .sort(([a], [b]) => a.localeCompare(b))
    .map(([k, v]) => `${k}=${v}`)
    .join('&');

  const sig = crypto
    .createHmac('sha256', secretKey)
    .update(canonical)
    .digest('hex');

  const qs = new URLSearchParams({ ...signable, sig });
  return `https://og.planhub.kr/v1/og?${qs}`;
}

const url = signOgUrl(process.env.OGSHOT_SECRET_KEY, {
  title: 'My Blog Post',
  theme: 'dark',
});