Retool + CaptchaAI: Herramienta interna Manejo de formularios CAPTCHA

Retool permite a los equipos crear herramientas internas rápidamente. Cuando esas herramientas necesitan interactuar con servicios externos protegidos por CAPTCHA (enviar formularios, extraer datos de portales o automatizar flujos de trabajo de terceros)CaptchaAImaneja la resolución a través de consultas API REST de Retool.

Esta guía muestra cómo configurar CaptchaAI como un recurso de API REST en Retool, crear consultas para enviar y recuperar soluciones CAPTCHA y conectarlas a la interfaz de usuario de su aplicación.

Escenario del mundo real

Su equipo de operaciones utiliza una aplicación Retool para enviar datos a un portal gubernamental que requiere reCAPTCHA v2. En lugar de resolver CAPTCHA manualmente, la aplicación Retool:

1. Toma la clave del sitio y la URL de la página como entrada
2. Envía el CAPTCHA a CaptchaAI
3. Consultas para el resultado
4. Muestra el token resuelto para usar en el envío del formulario.

Paso 1: cree CaptchaAI como recurso de API REST

En Retool, navegue hasta Recursos -> Crear nuevo -> API REST:

Guarde el recurso. Lo hará referencia en las consultas.

Paso 2: crear la consulta de envío

Cree una nueva consulta llamada submitCaptcha:

Parámetros de consulta:

Guarde su clave API en la Tienda de secretos de Retool (Configuración → Secretos) para evitar codificarla.

Transformador (opcional):

// Parse the response
const data = {{ submitCaptcha.data }};
if (data.status === 1) {
  return { taskId: data.request, status: 'submitted' };
}
return { error: data.request, status: 'failed' };

Paso 3: crear la consulta de consulta

Cree una consulta llamada pollResult:

Parámetros de consulta:

Transformador:

const data = {{ pollResult.data }};
if (data.status === 1) {
  return { token: data.request, status: 'solved' };
}
if (data.request === 'CAPCHA_NOT_READY') {
  return { status: 'pending' };
}
return { error: data.request, status: 'error' };

Paso 4: cree el ciclo de sondeo con JavaScript

Cree una consulta de JavaScript llamada solveCaptcha que organice el ciclo de envío y sondeo:

// solveCaptcha — JavaScript Query
async function solve() {
  // Submit the CAPTCHA task
  await submitCaptcha.trigger();
  const submitResult = submitCaptcha.data;

  if (submitResult.status !== 1) {
    return { error: submitResult.request, status: 'submit_failed' };
  }

  const taskId = submitResult.request;

  // Wait 15 seconds before first poll
  await new Promise(r => setTimeout(r, 15000));

  // Poll up to 20 times (100 seconds max)
  for (let i = 0; i < 20; i++) {
    await pollResult.trigger({
      additionalScope: { taskId: taskId }
    });

    const result = pollResult.data;

    if (result.status === 1) {
      return { token: result.request, status: 'solved' };
    }

    if (result.request !== 'CAPCHA_NOT_READY') {
      return { error: result.request, status: 'error' };
    }

    // Wait 5 seconds before next poll
    await new Promise(r => setTimeout(r, 5000));
  }

  return { error: 'Polling timeout', status: 'timeout' };
}

return solve();

Paso 5: construye la interfaz de usuario

Cree un diseño de aplicación Retool simple:

Sección de entrada

• Entrada de texto (sitekeyInput): Etiqueta "reCAPTCHA Sitekey"
• Entrada de texto (pageurlInput): Etiqueta "URL de página"
• Botón (solveButton): Etiqueta "Resolver CAPTCHA", al hacer clic -> solveCaptcha.trigger()

Sección de estado

• Componente Texto: {{ solveCaptcha.isFetching ? "Solving..." : "" }}
• Indicador de carga: Visible cuando {{ solveCaptcha.isFetching }}

Sección de resultados

• Área de texto (tokenOutput):
• Valor: {{ solveCaptcha.data?.token || '' }}
• Etiqueta: "Token resuelto"
• Sólo lectura
• Botón Copiar: Copia el token al portapapeles
• Insignia de estado: muestra el éxito/error basado en {{ solveCaptcha.data?.status }}

Paso 6: utilice el token en consultas posteriores

Una vez resuelto, use el token en otra consulta de Retool que envíe el formulario:

Cree una consulta llamada submitForm:

Conecte esto a un botón "Enviar formulario" que está habilitado solo cuando {{ solveCaptcha.data?.status === 'solved' }}.

Solución de problemas

Preguntas frecuentes

¿Puedo almacenar la clave API CaptchaAI de forma segura en Retool?

Sí. Utilice la tienda de secretos de Retool (Environment -> Secrets) y haga referencia a ella como {{secretsStore.CAPTCHAAI_API_KEY}}. Esto mantiene la clave fuera de las definiciones de consulta visible para los creadores de aplicaciones.

¿Funciona esto con Retool Cloud y Self-hospedado?

Sí, ambas versiones admiten recursos de API REST y consultas de JavaScript. Retool autohospedado también puede acceder a la API de CaptchaAI directamente sin requisitos de proxy.

¿Puedo crear un módulo reutilizable de resolución de CAPTCHA en Retool?

Sí. Cree un módulo Retool con las consultas submit/poll y los componentes de la interfaz de usuario, luego incorpórelo en cualquier aplicación que necesite resolver CAPTCHA.

¿Qué tipos de CAPTCHA puedo resolver mediante Retool?

Cualquier tipo de CaptchaAI admite: reCAPTCHA v2/v3, Cloudflare Turnstile, CAPTCHA de imagen. Ajuste method y los parámetros en la consulta enviada en consecuencia.

Artículos relacionados

• Cómo resolver la devolución de llamada de Recaptcha V2 usando Api
• Torniquete Recaptcha V2 Manejo en el mismo sitio
• Mecanismo de devolución de llamada Recaptcha V2

Próximos pasos

Agregue resolución CAPTCHA a sus herramientas internas de Retool:obtenga su clave API CaptchaAIy configure el recurso API REST.

Guías relacionadas:

• Zapier + CaptchaAI: resolución de CAPTCHA sin código
• Hacer (Integromat) + CaptchaAI
• Extracción de parámetros reCAPTCHA de la fuente de la página