Docs
Examples

Examples

Common use cases and code examples for Captr APIs

Examples

Screenshots API Examples

Basic Screenshot

async function captureScreenshot(url: string) {
  const response = await fetch(
    `https://api.captr.dev/v1/capture?url=${encodeURIComponent(url)}`,
    {
      headers: {
        'X-API-Token': 'YOUR_API_KEY'
      }
    }
  );
 
  if (!response.ok) {
    throw new Error(`Failed to capture screenshot: ${response.statusText}`);
  }
 
  return await response.blob();
}

Full Page Screenshot

async function captureFullPage(url: string) {
  const params = new URLSearchParams({
    url,
    fullPage: 'true',
    width: '1280',
    height: '720',
    format: 'jpeg',
    quality: '90'
  });
 
  const response = await fetch(`https://api.captr.dev/v1/capture?${params}`, {
    headers: {
      'X-API-Token': 'YOUR_API_KEY'
    }
  });
 
  return await response.blob();
}

Image Transform API Examples

Basic Image Transform

async function transformImage(imageUrl: string) {
  const params = new URLSearchParams({
    url: imageUrl,
    width: '800',
    format: 'webp',
    quality: '90'
  });
 
  const response = await fetch(`https://api.captr.dev/v1/transform?${params}`, {
    headers: {
      'X-API-Token': 'YOUR_API_KEY'
    }
  });
 
  return await response.blob();
}

Advanced Image Transform

async function advancedTransform(imageUrl: string) {
  const params = new URLSearchParams({
    url: imageUrl,
    width: '1200',
    height: '630',
    fit: 'cover',
    format: 'webp',
    quality: '90',
    background: '#ffffff'
  });
 
  const response = await fetch(`https://api.captr.dev/v1/transform?${params}`, {
    headers: {
      'X-API-Token': 'YOUR_API_KEY'
    }
  });
 
  return await response.blob();
}

Batch Processing Examples

Batch Screenshots

async function captureMultipleScreenshots(urls: string[]) {
  const results = await Promise.allSettled(
    urls.map((url) =>
      fetch(`https://api.captr.dev/v1/capture?url=${encodeURIComponent(url)}`, {
        headers: {
          'X-API-Token': 'YOUR_API_KEY'
        }
      }).then((res) => res.blob())
    )
  );
 
  return results.map((result, index) => ({
    url: urls[index],
    success: result.status === 'fulfilled',
    data: result.status === 'fulfilled' ? result.value : null,
    error: result.status === 'rejected' ? result.reason : null
  }));
}

Batch Image Transforms

async function transformMultipleImages(
  images: Array<{ url: string; width: number }>
) {
  const results = await Promise.allSettled(
    images.map((img) =>
      fetch(
        `https://api.captr.dev/v1/transform?${new URLSearchParams({
          url: img.url,
          width: img.width.toString(),
          format: 'webp'
        })}`,
        {
          headers: {
            'X-API-Token': 'YOUR_API_KEY'
          }
        }
      ).then((res) => res.blob())
    )
  );
 
  return results.map((result, index) => ({
    image: images[index],
    success: result.status === 'fulfilled',
    data: result.status === 'fulfilled' ? result.value : null,
    error: result.status === 'rejected' ? result.reason : null
  }));
}

Error Handling

async function handleApiError(promise: Promise<Response>) {
  try {
    const response = await promise;
    if (!response.ok) {
      const error = await response.json();
      throw new Error(error.message || 'API request failed');
    }
    return await response.blob();
  } catch (error) {
    console.error('API Error:', error);
    throw error;
  }
}
 
// Usage example
const screenshot = await handleApiError(
  fetch('https://api.captr.dev/v1/capture?url=https://example.com', {
    headers: { 'X-API-Token': 'YOUR_API_KEY' }
  })
);

Pricing Note

Remember that each API has different pricing:

  • Screenshots API: $1 per 200 requests
  • Image Transform API: $1 per 1,000 requests

Both APIs include 100 free requests per month in the free tier.