Cómo resolver CAPTCHA en el navegador usando la API de CapSolver

El uso del navegador es una potente biblioteca de Python de código abierto que permite a los agentes de IA controlar los navegadores web para automatizar tareas como la extracción de datos, el llenado de formularios y las actividades repetitivas en línea. Al aprovechar Playwright para la automatización del navegador e integrarse con modelos de lenguaje extenso (LLM) como los modelos GPT de OpenAI, el uso del navegador permite a los usuarios emitir comandos de lenguaje natural, haciéndolo accesible incluso para aquellos sin amplios conocimientos de programación. Sin embargo, un desafío común en la automatización web es encontrar CAPTCHA, que están diseñados para bloquear los scripts automatizados y pueden interrumpir los flujos de trabajo del uso del navegador.

CapSolver es un servicio impulsado por IA que se especializa en resolver varios tipos de CAPTCHA, incluyendo reCAPTCHA y Cloudflare Turnstile. Al integrar CapSolver con el uso del navegador, puede asegurarse de que sus tareas de automatización continúen sin problemas sin requerir intervención manual para resolver los CAPTCHA.

Este artículo proporciona una guía paso a paso sobre cómo integrar CapSolver con el uso del navegador para manejar los CAPTCHA de manera efectiva. Cubriremos la configuración necesaria, proporcionaremos un ejemplo de código completo y compartiremos las mejores prácticas para ayudarlo a comenzar.

Descripción general y casos de uso del navegador

Browser-use es una biblioteca de Python que simplifica la automatización web al permitir que los agentes de IA interactúen con los sitios web a través de instrucciones de lenguaje natural. Utiliza Playwright en segundo plano para controlar navegadores como Chromium, Firefox y WebKit, e integra con LLM para interpretar y ejecutar comandos de usuario. Esto hace que el uso del navegador sea ideal para automatizar tareas complejas sin escribir código extenso.

Casos de uso

El uso del navegador admite una variedad de tareas de automatización, que incluyen:

• Extracción de datos: Extraer datos de sitios web para investigación de mercado, monitoreo de precios o agregación de contenido.
• Llenado de formularios: Automatizar el proceso de completar formularios en línea con datos de varias fuentes, como solicitudes de empleo o registros de cuentas.
• Automatización de tareas: Realizar tareas repetitivas como iniciar sesión en cuentas, navegar por sitios web o hacer clic en botones.

Estas tareas a menudo implican interactuar con sitios web que implementan CAPTCHA para evitar el acceso automatizado, lo que hace que una solución confiable para resolver CAPTCHA sea esencial para una automatización ininterrumpida.

Por qué se necesita la resolución de CAPTCHA

Los sitios web a menudo implementan defensas anti-bot como CAPTCHA para bloquear el acceso automatizado, el correo no deseado y las actividades maliciosas. Estos CAPTCHA, diseñados para diferenciar a los humanos de los bots con desafíos como hacer clic en casillas de verificación o resolver rompecabezas de imágenes, representan un obstáculo significativo para la extracción de datos web. Al automatizar tareas con el uso del navegador, encontrar un CAPTCHA puede detener el proceso por completo, evitando que la herramienta extraiga los datos deseados sin intervención manual.

Los tipos comunes de CAPTCHA incluyen:

Para la extracción de datos web, este es un problema crítico: los CAPTCHA están específicamente diseñados para frustrar el tipo de automatización en la que confía el uso del navegador para extraer datos de los sitios web. Sin una forma de evitar estas barreras, los esfuerzos de extracción de datos se paralizan, lo que hace que la automatización sea ineficaz. Afortunadamente, la integración de la API de CapSolver con el uso del navegador proporciona una solución poderosa. CapSolver resuelve automáticamente estos CAPTCHA, lo que permite que el uso del navegador pase a través de las defensas anti-bot y extraiga datos con éxito sin interrupciones. Ya sea que se trate de reCAPTCHA v2 o Cloudflare Turnstile, CapSolver garantiza que el uso del navegador pueda abordar una amplia gama de desafíos de CAPTCHA, lo que lo convierte en una herramienta esencial para una extracción de datos fluida y eficiente de sitios web protegidos.

Esta integración es un cambio de juego para cualquiera que busque extraer datos de sitios que usan CAPTCHA, ya que elimina la necesidad de entrada manual y mantiene el proceso de extracción de datos web funcionando sin problemas.

Cómo usar CapSolver para manejar CAPTCHA

CapSolver ofrece una API que puede resolver varios CAPTCHA utilizando algoritmos de IA avanzados. Para integrar CapSolver con el uso del navegador, puede definir una acción personalizada utilizando el decorador @controller.action. Esta acción detectará CAPTCHA en una página web, extraerá la información necesaria (por ejemplo, la clave del sitio para reCAPTCHA), llamará a la API de CapSolver para obtener una solución e inyectará la solución en la página.

Pasos para integrar CapSolver con el uso del navegador

1. Regístrate en CapSolver: Crea una cuenta en CapSolver, agrega fondos y obtén tu clave API.
2. Configura el uso del navegador: Instala el uso del navegador y sus dependencias, y configura tu entorno con claves API para un proveedor de LLM (por ejemplo, OpenAI).
3. Instala las dependencias: Usa Python e instala los paquetes necesarios: browser-use, playwright y requests.
4. Define una acción personalizada: Crea una acción personalizada en tu script de uso del navegador para manejar CAPTCHA usando la API de CapSolver.
5. Ejecuta el agente: Instruye al agente de IA para que llame a la acción personalizada cuando se encuentre un CAPTCHA durante la ejecución de la tarea.

Fragmento de código clave

A continuación, se muestra un ejemplo de una acción personalizada para resolver un reCAPTCHA v2 utilizando la API de CapSolver:

import requests
import time
from browser_use import Controller, ActionResult
from playwright.async_api import Page

CAPSOLVER_API_KEY = 'YOUR_CAPSOLVER_API_KEY'

@controller.action('Solve CAPTCHA', domains=['*'])
async def solve_captcha(page: Page) -> ActionResult:
    if await page.query_selector('.g-recaptcha'):
        site_key = await page.evaluate("document.querySelector('.g-recaptcha').getAttribute('data-sitekey')")
        page_url = page.url

        # Create task with CapSolver
        response = requests.post('https://api.capsolver.com/createTask', json={
            'clientKey': CAPSOLVER_API_KEY,
            'task': {
                'type': 'ReCaptchaV2TaskProxyLess',
                'websiteURL': page_url,
                'websiteKey': site_key,
            }
        })
        task_id = response.json().get('taskId')
        if not task_id:
            return ActionResult(success=False, message='Failed to create CapSolver task')

        # Poll for solution
        while True:
            time.sleep(5)
            result_response = requests.post('https://api.capsolver.com/getTaskResult', json={
                'clientKey': CAPSOLVER_API_KEY,
                'taskId': task_id
            })
            result = result_response.json()
            if result.get('status') == 'ready':
                solution = result.get('solution', {}).get('gRecaptchaResponse')
                if solution:
                    await page.evaluate(f"document.getElementById('g-recaptcha-response').innerHTML = '{solution}';")
                    return ActionResult(success=True, message='CAPTCHA solved')
                else:
                    return ActionResult(success=False, message='No solution found')
            elif result.get('status') == 'failed':
                return ActionResult(success=False, message='CapSolver failed to solve CAPTCHA')
    return ActionResult(success=False, message='No CAPTCHA found')

Este fragmento define una acción personalizada que verifica si hay un elemento reCAPTCHA v2, extrae la clave del sitio, crea una tarea con CapSolver, consulta la solución e inyecta el token en la página.

Ejemplo de código completo + explicación paso a paso

A continuación, se muestra un ejemplo de código completo que demuestra cómo integrar CapSolver con el uso del navegador para resolver CAPTCHA.

Requisitos previos

Asegúrese de tener los paquetes necesarios instalados:

pip install browser-use playwright requests
playwright install

Configura tu entorno con las claves API necesarias. Crea un archivo .env con tus claves API de OpenAI y CapSolver:

OPENAI_API_KEY=your_openai_api_key
CAPSOLVER_API_KEY=your_capsolver_api_key

Ejemplo de código completo

Crea un script de Python con el siguiente contenido:

import os
import asyncio
import requests
from dotenv import load_dotenv
from browser_use import Agent, Controller, ActionResult
from browser_use.browser import BrowserSession
from browser_use.llm import ChatOpenAI
from playwright.async_api import Page

# Load environment variables from .env file
load_dotenv()

CAPSOLVER_API_KEY = os.getenv('CAPSOLVER_API_KEY')

controller = Controller()

@controller.action('Solve CAPTCHA', domains=['*'])
async def solve_captcha(page) -> ActionResult:
    if await page.query_selector('.g-recaptcha'):
        site_key = await page.evaluate("document.querySelector('.g-recaptcha').getAttribute('data-sitekey')")
        page_url = page.url

        response = requests.post('https://api.capsolver.com/createTask', json={
            'clientKey': CAPSOLVER_API_KEY,
            'task': {
                'type': 'ReCaptchaV2TaskProxyLess',
                'websiteURL': page_url,
                'websiteKey': site_key,
            }
        })

        task_id = response.json().get('taskId')
        print(task_id)
        if not task_id:
            return ActionResult(success=False, message='Failed to create CapSolver task')

        while True:
            await asyncio.sleep(5)
            result_response = requests.post('https://api.capsolver.com/getTaskResult', json={
                'clientKey': CAPSOLVER_API_KEY,
                'taskId': task_id
            })
            result = result_response.json()
            print(f"CAPTCHA result status: {result.get('status')}")
            if result.get('status') == 'ready':
                solution = result.get('solution', {}).get('gRecaptchaResponse')
                print(f"CAPTCHA solution: {solution}")
                if solution:
                    print("Submitting CAPTCHA solution...")
                    # Try both possible input fields for the CAPTCHA token
                    await page.evaluate(f"""
                        // Try the standard g-recaptcha-response field
                        var gRecaptchaResponse = document.getElementById('g-recaptcha-response');
                        if (gRecaptchaResponse) {{
                            gRecaptchaResponse.innerHTML = '{solution}';
                            var event = new Event('input', {{ bubbles: true }});
                            gRecaptchaResponse.dispatchEvent(event);
                        }}
                        
                        // Also try the recaptcha-token field
                        var recaptchaToken = document.getElementById('recaptcha-token');
                        if (recaptchaToken) {{
                            recaptchaToken.value = '{solution}';
                            var event = new Event('input', {{ bubbles: true }});
                            recaptchaToken.dispatchEvent(event);
                        }}
                    """)
                    
                    # Wait a moment for the token to be processed
                    await asyncio.sleep(2)
                    print("Token injected successfully! CAPTCHA solved.")
                    
                    # Method 2: Click submit button directly using the correct selector
                    print("Now clicking submit button...")
                    try:
                        # Use the specific button selector you provided
                        submit_button = await page.query_selector("body > main > form > fieldset > button")
                        if submit_button:
                            await submit_button.click()
                            print("✅ Submit button clicked successfully!")
                        else:
                            print("❌ Submit button not found!")
                            return ActionResult(success=False, message='Submit button not found')
                    except Exception as e:
                        print(f"❌ Error clicking submit button: {e}")
                        return ActionResult(success=False, message=f'Error clicking submit: {e}')
                    
                    print("CAPTCHA solved and form submitted successfully!")
                    return ActionResult(success=True, message='CAPTCHA solved and form submitted')
                   
                else:
                    return ActionResult(success=False, message='No solution found')
            elif result.get('status') == 'failed':
                return ActionResult(success=False, message='CapSolver failed to solve CAPTCHA')
    return ActionResult(success=False, message='No CAPTCHA found')

llm = ChatOpenAI(model="gpt-4o-mini")

async def main():
    try:
        print("🚀 Starting browser-use CAPTCHA solver agent...")
        
        # Simple task instruction for CAPTCHA solving and form submission
        task = """Navigate to https://recaptcha-demo.appspot.com/recaptcha-v2-checkbox.php and solve the CAPTCHA, then submit the form.

STEP 1: Navigate to the reCAPTCHA demo page: https://recaptcha-demo.appspot.com/recaptcha-v2-checkbox.php

STEP 2: Wait for the page to fully load. You should see a form with input fields and a reCAPTCHA checkbox.

STEP 3: Look for a reCAPTCHA element (usually a checkbox that says "I'm not a robot" or similar).

STEP 4: Use the "solve_captcha" action to automatically solve the CAPTCHA and submit the form.

STEP 5: Report the final result.

Note: The solve_captcha action will handle both solving the CAPTCHA and submitting the form automatically."""
        
        # Create browser session first
        browser_session = BrowserSession()
        
        # Create agent with the browser session
        agent = Agent(
            task=task, 
            llm=llm, 
            controller=controller,
            browser_session=browser_session
        )
        
        print("📱 Running CAPTCHA solver agent...")
        result = await agent.run()
        print(f"✅ Agent completed: {result}")
        
        # Keep browser open to see results
        input('Press Enter to close the browser...')
        await browser_session.close()
        
    except Exception as e:
        print(f"❌ Error: {e}")

if __name__ == "__main__":
    asyncio.run(main())

Explicación paso a paso

| 1. Instalar Dependencias | Instala browser-use, playwright, y requests usando pip install browser-use playwright requests. Ejecuta playwright install para instalar los navegadores necesarios. |
| 2. Configurar el Entorno | Crea un archivo .env con tus claves de API de OpenAI y CapSolver para almacenar de forma segura las credenciales. |
| 3. Definir Acción Personalizada | Usa el decorador @controller.action para definir solve_captcha, que comprueba si hay un elemento reCAPTCHA v2, extrae la clave del sitio, llama a la API de CapSolver e inyecta la solución en la página. |
| 4. Inicializar Controlador y Agente | Crea una instancia de Controller, define la acción personalizada, inicializa el LLM (ej., ChatOpenAI con GPT-4o-mini), y crea el agente BrowserUse con el controlador. |
| 5. Ejecutar el Agente | Proporciona una tarea que incluya instrucciones para resolver CAPTCHAs usando la acción personalizada si se encuentran. El agente navega a la URL especificada, detecta el CAPTCHA, llama a la acción personalizada y envía el formulario. |
| 6. Manejo de Errores | La acción personalizada incluye manejo de errores para los casos en que la tarea de CapSolver falla o no se encuentra ninguna solución, devolviendo objetos ActionResult apropiados. |
| 7. Limpieza | El agente gestiona automáticamente los recursos del navegador, cerrando el navegador cuando la tarea se completa. |

Este ejemplo se centra en reCAPTCHA v2, pero puedes adaptarlo para otros tipos de CAPTCHA modificando el tipo de tarea (ej., AntiTurnstileTaskProxyLess para Turnstile).

Recorrido de la Demo

Esta sección describe cómo funciona la integración usando una tarea de muestra para navegar a una página de demostración con una casilla de verificación reCAPTCHA v2 y enviar el formulario.

1. Configuración de la Tarea: La tarea indica al agente de IA que visite https://recaptcha-demo.appspot.com/recaptcha-v2-checkbox.php, envíe el formulario y resuelva cualquier CAPTCHA usando la acción solve_captcha.
2. Ejecución del Agente: El agente Browser-use inicia un navegador controlado por Playwright y navega a la URL especificada.
3. Detección de CAPTCHA: El agente comprueba si hay un CAPTCHA buscando el elemento .g-recaptcha. Si lo encuentra, activa la acción solve_captcha.
4. Ejecución de la Acción Personalizada: La acción solve_captcha extrae la clave del sitio y la URL de la página, crea una tarea con la API de CapSolver y sondea la solución.
5. Inyección de la Solución: Una vez que se recibe la solución, la acción inyecta el token en el campo g-recaptcha-response.
6. Envío del Formulario: El agente envía el formulario haciendo clic en el botón de envío, completando la tarea.
7. Compleción de la Tarea: El agente devuelve el resultado, indicando el envío exitoso del formulario.

Visualmente, verías el navegador navegar a la página de demostración, la casilla de verificación reCAPTCHA se marcaría automáticamente después de que se inyecte la solución y el formulario se enviaría correctamente.

Sección de Preguntas Frecuentes

Conclusión

La integración de CapSolver con Browser-use proporciona una solución robusta para manejar CAPTCHAs en tareas de automatización web. Al definir una acción personalizada para resolver CAPTCHAs, puedes asegurarte de que tus agentes de IA naveguen por los sitios web sin problemas, incluso cuando se enfrentan a medidas anti-bot. Esta combinación aprovecha la facilidad de uso de Browser-use y las potentes capacidades de resolución de CAPTCHA de CapSolver para crear flujos de trabajo de automatización eficientes.

Para comenzar, regístrate en CapSolver y explora Browser-use. Sigue las instrucciones de configuración e implementa el ejemplo de código proporcionado. Para obtener más detalles, visita la documentación de CapSolver y la documentación de Browser-use. ¡Prueba esta integración en tu próximo proyecto de automatización y experimenta la facilidad de resolver CAPTCHAs automáticamente!

Bono para usuarios de Browser-use: Usa el código promocional BROWSERUSE al recargar tu cuenta de CapSolver y recibe un crédito extra exclusivo del 6% —sin límites, sin vencimiento.

Navegadores y Herramientas Soportados

• Browser-use: Usa Playwright, soportando navegadores Chromium, Firefox y WebKit.
• CapSolver: Compatible con cualquier cliente con capacidad HTTP, incluyendo extensiones de navegador para Chrome y Firefox.

Aprende Más y Explora Otros Tipos de Frameworks

• Browser-use GitHub
• Sitio web oficial de CapSolver
• Documentación de Playwright
• Documentación de CapSolver
• Documentación de Browser-use