Integration Guide

Vercel Edge Functions + ShotLayer

Capture screenshots from Vercel Edge Functions with low latency. No headless browser, no cold starts -- just a fetch call to ShotLayer's API from the edge.

Add your API key to Vercel

Set your ShotLayer API key as an environment variable in your Vercel project settings, or add it via the CLI:

vercel env add SHOTLAYER_API_KEY

Tip

Get a free API key at shotlayer.dev -- no credit card required.

Create the Edge Function

Create an edge function that proxies screenshot requests to ShotLayer. The function accepts a url query parameter and returns a PNG image.

api/screenshot.ts

export const config = { runtime: 'edge' };

export default async function handler(request: Request) {
  const { searchParams } = new URL(request.url);
  const url = searchParams.get('url');

  if (!url)
    return new Response(
      JSON.stringify({ error: 'url parameter required' }),
      { status: 400, headers: { 'Content-Type': 'application/json' } }
    );

  const screenshot = await fetch(
    `https://api.shotlayer.dev/v1/screenshot?url=${encodeURIComponent(url)}&width=1280&height=720`,
    {
      headers: {
        'Authorization': `Bearer ${process.env.SHOTLAYER_API_KEY}`,
      },
    }
  );

  return new Response(screenshot.body, {
    headers: {
      'Content-Type': 'image/png',
      'Cache-Control': 'public, max-age=3600',
    },
  });
}

Deploy and test

Deploy your project and test the edge function by passing any URL:

# Deploy
vercel deploy

# Test it
curl "https://your-project.vercel.app/api/screenshot?url=https://example.com" \
  -o screenshot.png

Performance

Edge functions run close to your users. Combined with ShotLayer's sub-2-second rendering and the 1-hour cache, most requests resolve in milliseconds after the first capture.

Start capturing screenshots at the edge

Get a free API key and deploy your first edge function in minutes.

Get API Key Free →

More integration guides

Next.js OG Images Dynamic OG images in 5 minutes Cloudflare Workers Screenshots without Puppeteer Supabase Edge Functions Screenshots for your Supabase app