Getting Started with Screenshots API

The Screenshots API is a powerful serverless service that allows you to capture high-quality screenshots of web pages with advanced features like ad blocking, cookie consent handling, and device emulation.

Prerequisites

1. Get Your API Key:

   • Go to the API Keys page
   • Copy your API key from the API Keys Page
   

2. Basic understanding of HTTP requests

Basic Usage

The API is simple to use and supports GET requests with query parameters. Here's a basic example:

async function takeScreenshot() {
  const params = new URLSearchParams({
    url: 'https://example.com',
    fmt: 'png',
    qual: 80,
    full: false,
    ads: true,
    cookie: true,
    track: true,
    wait: 0,
    clear: true,
    device: 'desktop',
    dark: false,
    width: 1920,
    height: 1080,
    scale: 1,
    mobile: false,
    touch: false,
    land: true,
    load: 'networkidle',
    timeout: 120,
    trans: false
  });
 
  const response = await fetch(`https://api.screenshotsapi.dev/take?${params}`, {
    headers: {
      'Authorization': 'Bearer YOUR_API_KEY'
    }
  });
  
  if (!response.ok) {
    throw new Error(`HTTP error! status: ${response.status}`);
  }
  
  const result = await response.json();
  console.log('Screenshot captured:', result.message);
  console.log('URL:', result.url);
  console.log('Duration:', result.duration, 'ms');
  console.log('Timestamp:', result.timestamp);
  
  return result;
}

Key Features

The API supports several powerful features through query parameters:

1. Format Control: Choose between PNG or JPEG with fmt parameter
2. Quality Settings: Adjust image quality with qual parameter (0-100)
3. Page Capture Options:
   • full: Capture full page height
   • width/height: Set viewport dimensions
   • scale: Control device pixel ratio
4. Content Handling:
   • ads: Enable/disable ad blocking
   • cookie: Handle cookie consent banners
   • track: Block tracking scripts
5. Device Emulation:
   • device: Choose device type (desktop/mobile)
   • mobile: Enable mobile viewport
   • touch: Enable touch events
   • land: Force landscape mode
6. Rendering Options:
   • dark: Enable dark mode
   • trans: Enable transparent background
7. Performance Controls:
   • wait: Wait time before capture (ms)
   • load: Page load strategy (networkidle)
   • timeout: Maximum capture time (seconds)

Next Steps

• Learn about advanced features
• Explore bulk screenshot capabilities