Migrate from Browserless to ScreenshotAPI

Your Code → Puppeteer/Playwright → Browserless WebSocket → Chrome → Screenshot

Your Code → HTTP GET → ScreenshotAPI → Screenshot

javascript
import puppeteer from 'puppeteer';

async function takeScreenshot(url) {
  const browser = await puppeteer.connect({
    browserWSEndpoint: `wss://chrome.browserless.io?token=${BROWSERLESS_TOKEN}`
  });

  const page = await browser.newPage();
  await page.setViewport({ width: 1440, height: 900 });
  await page.goto(url, { waitUntil: 'networkidle0', timeout: 30000 });
  const buffer = await page.screenshot({ type: 'png' });

  await page.close();
  await browser.disconnect();

  return buffer;
}

javascript
async function takeScreenshot(url) {
  const response = await fetch(
    `https://chrome.browserless.io/screenshot?token=${BROWSERLESS_TOKEN}`,
    {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({
        url,
        options: {
          type: 'png',
          fullPage: false
        },
        viewport: {
          width: 1440,
          height: 900
        },
        waitForTimeout: 5000
      })
    }
  );

  return Buffer.from(await response.arrayBuffer());
}

javascript
async function takeScreenshot(url) {
  const params = new URLSearchParams({
    url,
    width: '1440',
    height: '900',
    type: 'png',
    waitUntil: 'networkidle'
  });

  const response = await fetch(
    `https://screenshotapi.to/api/v1/screenshot?${params}`,
    { headers: { 'x-api-key': process.env.SCREENSHOT_API_KEY } }
  );

  if (!response.ok) throw new Error(`Screenshot failed: ${response.status}`);
  return Buffer.from(await response.arrayBuffer());
}

javascript
import puppeteer from 'puppeteer';

async function captureFullPageDark(url) {
  const browser = await puppeteer.connect({
    browserWSEndpoint: `wss://chrome.browserless.io?token=${process.env.BROWSERLESS_TOKEN}`
  });

  try {
    const page = await browser.newPage();
    await page.setViewport({ width: 1440, height: 900 });
    await page.emulateMediaFeatures([
      { name: 'prefers-color-scheme', value: 'dark' }
    ]);
    await page.goto(url, { waitUntil: 'networkidle0' });
    const buffer = await page.screenshot({ fullPage: true, type: 'png' });
    await page.close();
    return buffer;
  } finally {
    await browser.disconnect();
  }
}

javascript
async function captureFullPageDark(url) {
  const params = new URLSearchParams({
    url,
    width: '1440',
    fullPage: 'true',
    colorScheme: 'dark',
    type: 'png',
    waitUntil: 'networkidle'
  });

  const response = await fetch(
    `https://screenshotapi.to/api/v1/screenshot?${params}`,
    { headers: { 'x-api-key': process.env.SCREENSHOT_API_KEY } }
  );

  return Buffer.from(await response.arrayBuffer());
}

json
{
  "dependencies": {
    "puppeteer-core": "^22.0.0"
  }
}

json
{
  "dependencies": {}
}