Utiliser un solveur de CAPTCHA avec Playwright

1. 1.

   Installer Node.js 22+, Playwright et Chromium

   Installez le paquet playwright et son binaire de navigateur Chromium. Installez le SDK JavaScript officiel de solvethree à l’aide du paquet téléchargeable solvethree-sdk-0.1.0.tgz ; les instructions d’intégration Node.js fournissent sa commande d’installation par téléchargement direct.

2. 2.

   Configurer le nom d’hôte dans solvethree

   Le nom d’hôte de la page HTTPS que vous contrôlez doit disposer d’un profil reCAPTCHA actif, accessible à votre espace de travail. Configurez-le dans la console avant d’exécuter l’exemple. L’envoi d’un nom d’hôte et d’une action dans une tâche ne crée pas le profil.

3. 3.

   Définir les trois variables d’environnement

   Définissez TARGET_URL sur l’URL complète de la page HTTPS que vous contrôlez, SOLVETHREE_PROXY sur l’URL du proxy et SOLVETHREE_API_KEY sur la clé API de votre espace de travail. Exécutez le script côté serveur ; ne placez pas la clé API dans le JavaScript de la page. L’exemple utilise l’action login, que vous devez modifier si votre application utilise une autre action.

4. 4.

   Fournir le formulaire de l’exemple

   La page doit contenir une zone de texte nommée g-recaptcha-response et un bouton dont le nom accessible est exactement Submit. Si votre formulaire est différent, adaptez le transfert décrit ci-dessous avant de l’exécuter.

Le proxy de la tâche et celui du navigateur Playwright sont configurés séparément. Le proxy d’un contexte de navigateur n’achemine pas automatiquement les requêtes API côté serveur du SDK. Cet exemple fournit un proxy à la tâche et le réutilise pour le trafic du navigateur vers la cible.

// Install playwright and the official solvethree SDK first.
import { chromium } from 'playwright';
import { Solvethree } from '@solvethree/sdk';

const target = new URL(process.env.TARGET_URL); // Your configured HTTPS page.
const proxy = new URL(process.env.SOLVETHREE_PROXY);
const client = new Solvethree({ apiKey: process.env.SOLVETHREE_API_KEY });
const result = await client.solve({
  site: target.hostname, action: 'login', proxy: process.env.SOLVETHREE_PROXY,
});
const browser = await chromium.launch();
try {
  const context = await browser.newContext({
    proxy: {
      server: `${proxy.protocol}//${proxy.host}`,
      username: decodeURIComponent(proxy.username),
      password: decodeURIComponent(proxy.password),
    },
    userAgent: result.solution.userAgent,
    extraHTTPHeaders: { 'sec-ch-ua': result.solution.secChUa },
  });
  const page = await context.newPage();
  await page.goto(target.href);
  // This example form has this field and a button named Submit.
  // Adapt the selectors/callback to your own application's form contract.
  await page.locator('[name="g-recaptcha-response"]').waitFor({ state: 'attached' });
  await page.locator('[name="g-recaptcha-response"]').evaluate((field, token) => {
    field.value = token;
    field.dispatchEvent(new Event('input', { bubbles: true }));
  }, result.solution.token);
  await Promise.all([
    page.waitForResponse(response =>
      response.request().method() === 'POST' &&
      new URL(response.url()).origin === target.origin),
    page.getByRole('button', { name: 'Submit', exact: true }).click(),
  ]);
  // Check your application's success response here.
} finally {
  await browser.close();
}

solve crée la tâche une seule fois et interroge son état jusqu’à ce qu’elle soit prête ou qu’une exception soit levée. Le navigateur ne démarre qu’après la réussite de cet appel. Son contexte utilise le proxy d’origine, y compris les éventuels identifiants encodés dans l’URL, ainsi que les valeurs solution.userAgent et solution.secChUa renvoyées.

Le formulaire reçoit solution.token, et non l’identifiant de la tâche. L’exemple attend que le champ soit attaché au DOM, car une zone de texte de jeton n’a pas besoin d’être visible. Il affecte le jeton, déclenche un événement de saisie, puis clique sur le bouton d’envoi.

• TARGET_URL appartient à votre application. La tâche de résolution reçoit son nom d’hôte dans site ; Playwright accède à l’URL complète.
• login est l’action de l’exemple. Remplacez-la par l’action utilisée par votre application.
• [name="g-recaptcha-response"] est le sélecteur du champ de jeton de l’exemple. Remplacez-le si votre application attend le jeton dans un autre champ ou paramètre de requête.
• Submit est le nom accessible du bouton de l’exemple. Remplacez ce localisateur ou utilisez le mécanisme d’envoi réel de votre application.
• L’événement de saisie fait partie du transfert de cette démonstration. Une application réelle peut aussi nécessiter une fonction de rappel, une mise à jour de son état, une valeur CSRF ou une session existante. Il n’existe pas de fonction de rappel universelle pour renseigner le jeton.

Avant de payer une autre résolution, inspectez la requête sortante de l’application à l’aide de l’observation des requêtes et des réponses de Playwright. Une tâche prête signifie qu’une solution est disponible ; la réponse de l’application indique si l’envoi a été accepté.

Le jeton envoyé est absent ou inchangé.

Inspectez le paramètre réel de la requête, et pas seulement la valeur de la zone de texte.

Essayez ceci : Transmettez solution.token via le mécanisme d’envoi réel de l’application. Mettre à jour le champ de démonstration ne sert à rien si l’application construit sa requête à partir d’un état distinct.

La requête contient le jeton, mais elle est rejetée.

Comparez le proxy, l’agent utilisateur, les indications client, le nom d’hôte cible et l’action de l’envoi avec ceux de la résolution. Vérifiez les exigences de l’application concernant la session et la protection CSRF.

Essayez ceci : Utilisez le même proxy pour la résolution et l’envoi, appliquez l’identité de navigateur renvoyée et respectez les exigences du formulaire de l’application avant l’envoi.

Le script échoue avant d’ouvrir le navigateur.

Distinguez une erreur de requête HTTP d’un échec définitif de la tâche. Pour une tâche en échec, inspectez errorCode et error.

Essayez ceci : Corrigez le problème signalé concernant les données d’entrée, le profil ou la connectivité, plutôt que de renvoyer sans cesse les mêmes données. Le SDK lève une exception en cas d’échec ; ne poursuivez pas jusqu’à l’étape de renseignement du jeton.