Deployment guide

Open Graph image API on vercel

Host this Next.js app on Vercel, set your `NEXT_PUBLIC_APP_URL` to the deployment origin, and point `og:image` to the same project’s `/api/og/...` route. Edge and Node runtimes are supported; the OG route runs on Node for key verification.

Use this guide when evaluating OGKit as a hosted Vercel OG alternative, screenshot-service alternative, or framework-neutral social preview image API. The important SEO rule is that canonical URLs, sitemap URLs, and generated image URLs should all use the same final HTTPS host.

Environment checklist

  • NEXT_PUBLIC_APP_URL=https://www.webmorp.art
  • OGKIT_KEY=ogk_live_...
  • API_KEY_SALT=...

Production checklist

  • Use the final production domain in public URL env vars.
  • Keep API keys server-side.
  • Let Vercel cache generated PNG responses.

Caching and crawlability

OGKit image responses include cache headers for CDN reuse. Keep image URLs deterministic so repeated shares hit cache instead of re-rendering.

For SEO crawlers, avoid bot challenges on public pages, robots.txt, and sitemap.xml. If a crawler sees a challenge page or a redirect chain, it may mark otherwise valid pages as non-indexable.

Frequently asked questions

How do I deploy an Open Graph image API on vercel?

Deploy OGKit with a final HTTPS public URL, set the required environment variables, and generate image URLs from server-side code or build-time metadata.

Should sitemap and canonical URLs use the deployment URL or final domain?

They should use the final canonical HTTPS domain. Preview URLs, http URLs, and www variants can create redirect and indexability issues.

Can I cache generated OG images?

Yes. OGKit image URLs are deterministic, and generated PNG responses include cache headers. Keep query strings intact when caching.

Related pages

OGKit turns one HTTPS URL into a 1200×630 Open Graph image. Read the API reference, the Open Graph SEO guide, try the Playground, or sign in to create API keys.