API de capture JavaScript : exemple complet de bout en bout

Installation

Installez le SDK JavaScript depuis npm :

npm install screenshotcenter

Capture basique

const ScreenshotCenter = require('screenshotcenter');
const client = new ScreenshotCenter({ apiKey: 'YOUR_API_KEY' });

const result = await client.create({ url: 'https://example.com' });
console.log(result.screenshot_url);

Le SDK gère le polling en interne — create() se résout quand la capture est prête.

Import ES module

import ScreenshotCenter from 'screenshotcenter';
const client = new ScreenshotCenter({ apiKey: process.env.SCREENSHOT_API_KEY });

Capture pleine page avec options

const result = await client.create({
  url: 'https://example.com',
  fullPage: true,
  screenWidth: 1920,
  screenHeight: 1080,
  deviceScale: 2,
  delay: 2000,
  hideAds: true,
  hidePopups: true,
});

Génération PDF

const result = await client.create({
  url: 'https://example.com/invoice',
  pdf: true,
  pdfFormat: 'A4',
  pdfMarginTop: '20mm',
  pdfMarginBottom: '20mm',
  pdfBackground: true,
});

// Télécharger le PDF
await client.download(result.id, 'invoice.pdf');

Voir l'API de génération PDF pour toutes les options disponibles.

Étapes d'automatisation

const result = await client.create({
  url: 'https://app.example.com/login',
  steps: [
    { action: 'type', target: '#email', value: 'user@example.com' },
    { action: 'type', target: '#password', value: 's3cret' },
    { action: 'click', target: 'button[type=submit]' },
    { action: 'wait', value: 3000 },
  ],
});

Voir l'API de capture authentifiée pour les patterns de connexion incluant l'injection de cookies et le SSO.

Extraction de données avec les trackers

const result = await client.create({
  url: 'https://example.com/product/123',
  trackers: [
    { name: 'price', selector: '.product-price', type: 'text' },
    { name: 'title', selector: 'h1', type: 'text' },
    { name: 'rating', selector: '.star-rating', type: 'attribute', attribute: 'data-score' },
  ],
});

// Accéder aux données extraites
for (const tracker of result.trackers ?? []) {
  console.log(`${tracker.name}: ${tracker.value}`);
}

Les trackers extraient des valeurs du DOM dans la même requête que la capture. Voir l'extraction de données de pages web.

Routage par pays

const result = await client.create({
  url: 'https://example.com',
  country: 'jp',
  locale: 'ja-JP',
  timezone: 'Asia/Tokyo',
});

Routez via plus de 80 pays pour vérifier le contenu localisé.

Livraison S3

const result = await client.create({
  url: 'https://example.com',
  apps: [{
    app: 's3',
    bucket: 'my-screenshots',
    path: 'captures/{yyyy}/{mm}/{dd}/{id}.png',
  }],
});

Voir l'intégration S3 pour la configuration et le setup IAM.

Captures par lots

const batch = await client.batchCreate({
  urls: [
    'https://example.com/page1',
    'https://example.com/page2',
    'https://example.com/page3',
  ],
  options: { fullPage: true, country: 'us' },
});

// Suivre la progression
const info = await client.batchInfo(batch.id);
console.log(`Progression : ${info.completed}/${info.total}`);

Voir captures par lots à grande échelle pour l'upload CSV et les options avancées.

Gestion des erreurs

try {
  const result = await client.create({ url: 'https://example.com' });
} catch (err) {
  if (err.statusCode === 429) {
    console.log('Rate limited — réessayer après', err.retryAfter);
  } else {
    console.error('Erreur API :', err.message);
  }
}

Intégration Express.js

const express = require('express');
const ScreenshotCenter = require('screenshotcenter');

const app = express();
const client = new ScreenshotCenter({ apiKey: process.env.SCREENSHOT_API_KEY });

app.get('/api/screenshot', async (req, res) => {
  const { url } = req.query;
  if (!url) return res.status(400).json({ error: 'url requis' });

  const result = await client.create({ url, fullPage: true });
  res.json({ screenshotUrl: result.screenshot_url });
});

app.listen(3001);

Étapes suivantes

Parcourez la référence complète du SDK JavaScript pour toutes les méthodes et paramètres. Pour Python, voir le SDK Python.