# Manejo de eventos CAPTCHA

### Método basado en eventos 

Para supervisar el proceso de resolución de CAPTCHA, recomendamos usar el método basado en eventos. Permite que tu script escuche mensajes personalizados enviados directamente desde la extensión.

#### Cómo funciona

La extensión envía un mensaje al `objeto window` Puedes capturarlos añadiendo un listener de eventos "message".

|                               |                                                     |
| ----------------------------- | --------------------------------------------------- |
| `oxylabs-captcha-solve-start` | Se detectó el CAPTCHA y se ha comenzado a resolver. |
| `oxylabs-captcha-solve-end`   | El CAPTCHA se resolvió con éxito.                   |
| `oxylabs-captcha-solve-error` | El auto-solver no pudo eludir el CAPTCHA.           |

Puedes suscribirte a estos eventos para pausar tu automatización y reanudar solo después de que el CAPTCHA haya sido manejado con éxito. Normalmente, la resolución de CAPTCHA toma hasta 30 segundos, dependiendo del tipo y la complejidad del CAPTCHA, pero en algunos casos puede tardar más, así que permite tiempo para que la resolución del CAPTCHA termine.

#### Ejemplos de código

{% tabs %}
{% tab title="Python (Playwright)" %}

```python
import sys
from playwright.sync_api import sync_playwright

# Configuration
EXTENSION_NAME = 'oxylabs-runtime'
CAPTCHA_SOLVE_END = 'oxylabs-captcha-solve-end'
CAPTCHA_SOLVE_ERROR = 'oxylabs-captcha-solve-error'
UB_BROWSER_URL = 'wss://<username>:<password>@ubc.oxylabs.io'
CAPTCHA_CHECK_TIMEOUT_SEC = 60
TARGET_URL = 'https://www.indeed.com/cmp/Bank-of-the-West/reviews?lang=any&fcountry=ALL&sort=date'

def run():
    with sync_playwright() as p:
        print('Opening browser page...')
        # Connect to the remote browser using CDP
        browser = p.chromium.connect_over_cdp(UB_BROWSER_URL)
        
        # Get the default context and create a new page
        ctx = browser.contexts[0]
        page = ctx.new_page()

        # This must be done BEFORE navigation.
        ctx.add_init_script(f"""
            window.addEventListener("message", (event) => {{
                if (event.data && event.data.source === "{EXTENSION_NAME}") {{
                    window.__extensionStatus = event.data.type;
                }}
            }});
        """)

        print('Opening target website...')
        page.goto(TARGET_URL, wait_until='domcontentloaded')

        try:
            # Wait for the extension status to change
            page.wait_for_function(
                """
                ([solveEnd, solveError]) => {
                    const status = window.__extensionStatus;
                    if (status === solveError) {
                        throw new Error("CAPTCHA solving failed");
                    }
                    return status === solveEnd;
                }
                """,
                arg=[CAPTCHA_SOLVE_END, CAPTCHA_SOLVE_ERROR],
                timeout=CAPTCHA_CHECK_TIMEOUT_SEC * 1000
            )
            print('CAPTCHA solved successfully, continue scraping...')
            
        except Exception as err:
            print(f'Error during CAPTCHA solve: {err}')
            browser.close()
            sys.exit(1)

        page.wait_for_selector('h1[data-testid="PageHeader-title-reviews"]')
        page.screenshot(path='page_screenshot.jpg')

        page.close()
        browser.close()
        print('Done.')

if __name__ == "__main__":
    run()
```

{% endtab %}

{% tab title="JavaScript (Playwright)" %}

```javascript
const { chromium } = require('playwright');

const 
    EXTENSION_NAME = 'oxylabs-runtime',
    CAPTCHA_SOLVE_END = 'oxylabs-captcha-solve-end',
    CAPTCHA_SOLVE_ERROR = 'oxylabs-captcha-solve-error',
    UB_BROWSER_URL = 'wss://<username>:<password>@ubc.oxylabs.io',
    CAPTCHA_CHECK_TIMEOUT_SEC = 60,
    TARGET_URL = 'https://www.indeed.com/cmp/Bank-of-the-West/reviews?lang=any&fcountry=ALL&sort=date';

(async () => {
    console.log('Opening browser page...');
    const browser = await chromium.connectOverCDP(UB_BROWSER_URL);
    const ctx = browser.contexts()[0];
    const page = await ctx.newPage();

    // This must be done BEFORE navigation.
    await ctx.addInitScript((extensionName) => {
        window.addEventListener("message", (e) => {
            if (e.data?.source !== extensionName) return;
            window.__extensionStatus = e.data.type;
        });
    }, EXTENSION_NAME);

    console.log('Opening target website...');
    await page.goto(TARGET_URL, { waitUntil: 'domcontentloaded' });

    try {
        await page.waitForFunction(
            ([solveEnd, solveError]) => {
                const status = window.__extensionStatus;
                if (status === solveError) {
                    throw new Error("CAPTCHA solving failed");
                }
                return status === solveEnd;
            },
            [CAPTCHA_SOLVE_END, CAPTCHA_SOLVE_ERROR],
            { timeout: CAPTCHA_CHECK_TIMEOUT_SEC * 1000 }
        );
        console.log('CAPTCHA solved successfully, continue scraping...');
    } catch (err) {
        console.error('Error during CAPTCHA solve:', err.message);
        await browser.close();
        process.exit(1);
    }

    await page.waitForSelector('h1[data-testid="PageHeader-title-reviews"]');
    await page.screenshot({ path: 'page_screenshot.jpg' });

    await page.close();
    await browser.close();
    console.log('Done.');
})();

```

{% endtab %}

{% tab title="JavaScript (Puppeteer)" %}

```javascript
const puppeteer = require('puppeteer');

const 
    EXTENSION_NAME = 'oxylabs-runtime', 
    CAPTCHA_SOLVE_END = 'oxylabs-captcha-solve-end',
    CAPTCHA_SOLVE_ERROR = 'oxylabs-captcha-solve-error',
    UB_BROWSER_URL = 'wss://<username>:<password>@ubc.oxylabs.io',
    CAPTCHA_CHECK_TIMEOUT_SEC = 60,
    TARGET_URL = 'https://www.indeed.com/cmp/Bank-of-the-West/reviews?lang=any&fcountry=ALL&sort=date';

(async () => {
    console.log('Opening browser page...');
    
    const browser = await puppeteer.connect({
        browserWSEndpoint: UB_BROWSER_URL,
    });
    const page = await browser.newPage();

    // This must be done BEFORE navigation.
    await page.evaluateOnNewDocument((extensionName) => {
        window.addEventListener("message", (e) => {
            if (e.data?.source !== extensionName) return;
            window.__extensionStatus = e.data.type;
        });
    }, EXTENSION_NAME);

    console.log('Opening target website...');
    await page.goto(TARGET_URL, { waitUntil: 'domcontentloaded' });

    try {
        await page.waitForFunction(
            (solveEnd, solveError) => {
                const status = window.__extensionStatus;
                if (status === solveError) {
                    throw new Error("CAPTCHA solving failed");
                }
                return status === solveEnd;
            },
            { timeout: CAPTCHA_CHECK_TIMEOUT_SEC * 1000 },
            CAPTCHA_SOLVE_END, 
            CAPTCHA_SOLVE_ERROR
        );
        console.log('CAPTCHA solved successfully, continue scraping...');
    } catch (err) {
        console.error('Error during CAPTCHA solve:', err.message);
        await browser.close();
        process.exit(1);
    }

    await page.waitForSelector('h1[data-testid="PageHeader-title-reviews"]');
    await page.screenshot({ path: 'page_screenshot.jpg' });

    await page.close();
    await browser.disconnect();
    console.log('Done.');
})();

```

{% endtab %}
{% endtabs %}