Next.js

Screenshot API for Next.js

Generate screenshots server-side in Next.js API routes or use client-side for live previews. Works with App Router and Pages Router.

Installation

npm install

Next.js Integration Example

// app/api/screenshot/route.ts
import { NextResponse } from "next/server";

export async function GET(request) {
  const { searchParams } = new URL(request.url);
  const url = searchParams.get("url");

  const res = await fetch(
    "https://snapapi.tech/v1/screenshot?" + new URLSearchParams({
      url, api_key: process.env.SNAPAPI_KEY, format: "png"
    })
  );

  return new NextResponse(await res.arrayBuffer(), {
    headers: { "Content-Type": "image/png" }
  });
}

Features

SnapAPI renders pages in a real Chromium browser, so JavaScript-heavy Next.js apps render perfectly. You get:

• Full JavaScript rendering (React, Vue, Angular, etc.)
• 9 device presets for mobile emulation
• Dark mode, full page, CSS selector capture
• Metadata extraction (title, description, links, text)
• PNG, JPEG, WebP output formats