
How to take screenshots in Next.js (without installing Chromium)
How to Take Screenshots in Next.js (Without Installing Chromium) The standard approach for screenshots in a Next.js app is Puppeteer or Playwright — which means adding a headless browser to your dependency tree, figuring out how to run Chromium on Vercel or your serverless platform, and debugging cold start timeouts when the browser takes too long to spin up. There's a simpler path: call a screenshot API from a Route Handler or API route. No browser, no Chromium, no deployment headaches. App Router: Route Handler // app/api/screenshot/route.js import { NextResponse } from ' next/server ' ; export async function POST ( request ) { const { url } = await request . json (); const res = await fetch ( ' https://pagebolt.dev/api/v1/screenshot ' , { method : ' POST ' , headers : { ' x-api-key ' : process . env . PAGEBOLT_API_KEY , ' Content-Type ' : ' application/json ' }, body : JSON . stringify ({ url , fullPage : true , blockBanners : true , format : ' png ' }) }); const image = await res .
Continue reading on Dev.to JavaScript
Opens in a new tab

