CI에서 이미지 미리 그리기

Mocco는 이미지를 처음 불러올 때 그립니다. 그리는 데 잠깐 시간이 걸리고, 어떤 앱은 이미지가 느리면 기다리지 않고 이미지 없이 링크를 보여 줍니다. 페이지를 공개할 때 CI가 바로 이미지를 그리게 하면, 첫 크롤러가 올 때 이미 저장되어 있습니다.

이때 CI에는 서명 시크릿이 필요 없습니다. Mocco가 프로젝트에 저장된 시크릿으로 서명하고 서명된 URL을 돌려줍니다. 다만 프로젝트에는 시크릿이 있어야 합니다(서명 시크릿 참고).

1. 키 만들기

소유자나 관리자가 프로젝트의 API 키에서 og:write 권한이 있는 시크릿 키를 만듭니다. CI 시크릿으로 저장하세요(예: MOCCO_API_KEY).

2. 그리기

curl -X POST https://api.mocco.club/v1/og/images \
  -H "Authorization: Bearer $MOCCO_API_KEY" \
  -H 'Content-Type: application/json' \
  -d '{"template":"article","params":{"brand":"Acme Docs","eyebrow":"Guides","title":"Install in five minutes"}}'

params는 템플릿의 항목을 문자열로 넣은 것으로, 서명된 URL에 쓰는 항목과 같고 s만 뺍니다(템플릿 참고). Mocco는 이렇게 응답합니다.

{ "url": "https://api.mocco.club/v1/og/<project id>/article.png?brand=…&s=…", "hash": "<64자리 16진수>" }

url을 페이지의 og:image에 넣으세요. 같은 항목이면 @mocco/node와 콘솔이 서명하는 URL과 같고, 이제 저장된 이미지로 제공됩니다. 같은 요청을 다시 보내면 아무것도 새로 그리지 않고 같은 응답을 돌려주므로, 배포할 때마다 실행해도 됩니다.

Mocco의 응답

1분에 60개 한도는 서명된 URL로 불러오는 이미지와 함께 셉니다. 여러 페이지를 한꺼번에 미리 그린다면 Retry-After만큼 기다렸다가 이어서 하세요.