Usa un servicio de resolución de CAPTCHA con Puppeteer

1. 1.

   Instala Puppeteer y el SDK

   Usa Node.js 22 o posterior. Con npm, instala puppeteer y el archivo tarball del SDK oficial disponible en https://solvethree.com/downloads/solvethree-sdk-0.1.0.tgz. El SDK se importa como @solvethree/sdk; usa la URL de descarga en lugar de dar por hecho que está publicado en el registro de npm. Guarda el ejemplo como un módulo ES, por ejemplo, en un archivo con extensión .mjs.

2. 2.

   Configura el perfil del sitio

   Configura tu nombre de host propio en la consola de solvethree y asegúrate de que su perfil esté activo para tu espacio de trabajo. Enviar un nombre de host y una acción no crea ese perfil. El ejemplo usa la acción login; cámbiala por la acción configurada para tu aplicación.

3. 3.

   Configura las variables de entorno

   Establece TARGET_URL con la URL del formulario HTTPS propio, SOLVETHREE_PROXY con la URL de tu proxy HTTP o HTTPS y SOLVETHREE_API_KEY con la clave de tu espacio de trabajo. Mantén la clave en el proceso de Node.js, no en el JavaScript de la página. El ejemplo usa un único proxy tanto para la resolución como para el envío desde el navegador.

El valor de site de la tarea es el nombre de host extraído de TARGET_URL, no la URL completa de la página. Para reCAPTCHA, envía site, action y exactamente uno de los campos proxy o proxyCandidates; no añadas un campo type ni url. Este ejemplo usa proxy para que Puppeteer pueda usar directamente ese mismo proxy.

// Install puppeteer and the official solvethree SDK first.
import puppeteer from 'puppeteer';
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 puppeteer.launch({
  args: [`--proxy-server=${proxy.protocol}//${proxy.host}`],
});
try {
  const page = await browser.newPage();
  if (proxy.username) await page.authenticate({
    username: decodeURIComponent(proxy.username),
    password: decodeURIComponent(proxy.password),
  });
  await page.setUserAgent({ userAgent: result.solution.userAgent });
  await page.setExtraHTTPHeaders({ 'sec-ch-ua': result.solution.secChUa });
  await page.goto(target.href);
  // Adapt these selectors and any required callback to your own form.
  await page.waitForSelector('[name="g-recaptcha-response"]');
  await page.$eval('[name="g-recaptcha-response"]', (field, token) => {
    field.value = token;
    field.dispatchEvent(new Event('input', { bubbles: true }));
  }, result.solution.token);
  await Promise.all([
    page.waitForNavigation({ waitUntil: 'domcontentloaded' }),
    page.click('button[type="submit"]'),
  ]);
  // Check your application's success response here.
} finally {
  await browser.close();
}

client.solve crea la tarea una sola vez y consulta su estado hasta que esté lista o se lance una excepción. Este ejemplo inicia Puppeteer solo después de que la llamada devuelva un resultado. El navegador usa el proxy de la tarea, se autentica si hay credenciales del proxy y aplica solution.userAgent y solution.secChUa antes de navegar.

No sustituyas ese proxy ni esa identidad de navegador por valores ajenos al enviar el token. Si más adelante cambias a proxyCandidates, usa la función auxiliar successfulProxy del SDK para seleccionar el proxy original que funcionó y usarlo en el navegador.

Si la resolución falla, inspecciona errorCode y error de la tarea en lugar de reintentar con los mismos datos de entrada. Los errores de solicitud HTTP son distintos de los fallos terminales de las tareas. El bloque finally cierra el navegador local después de las operaciones del navegador; cerrar páginas no es un mecanismo para cancelar tareas remotas.

• [name="g-recaptcha-response"] selecciona el área de texto de la demostración. Sustitúyelo si tu aplicación recibe el token a través de otro campo o parámetro de la solicitud. El valor que debes enviar es solution.token, no el ID de la tarea.
• button[type="submit"] selecciona el botón de envío de la demostración. Usa el control o mecanismo de envío real de tu aplicación.
• El ejemplo asigna el token y dispara un evento input. Esto no sustituye un callback específico de la aplicación. Añade los callbacks, el valor CSRF, los campos de inicio de sesión y la configuración de sesión que sean necesarios antes del envío.
• Sustituye el comentario final de comprobación de éxito por una aserción sobre la respuesta de tu aplicación o el estado resultante. Que una tarea de resolución esté lista no demuestra que la aplicación haya aceptado el token.

Si reutilizas un navegador en ejecución, elige su BrowserContext de forma deliberada: una página nueva no implica automáticamente una sesión independiente. Mantén juntos los requisitos de sesión del formulario en lugar de mezclar páginas de flujos de trabajo no relacionados.