> For the complete documentation index, see [llms.txt](https://developers.oxylabs.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://developers.oxylabs.io/products/es/agent-browser/session-inspection-and-recording.md).

# Inspección y grabación de sesiones

Mira cómo depurar sesiones de automatización de Oxylabs Agent Browser mediante una interfaz gráfica en tiempo real.

Oxylabs Agent Browser proporciona [**Inspección de sesión**](#session-inspection-vnc) y [**Grabación de sesiones**](#session-recording) para observar la automatización del navegador en tiempo real o revisar reproducciones en video de sesiones anteriores. Estas funciones de depuración visual te permiten:

* Diagnosticar problemas complejos que no son evidentes en los registros o mensajes de error
* Entender el renderizado de la página exactamente como lo ve el navegador
* Verificar la ejecución correcta de tus flujos de trabajo de automatización
* Solucionar comportamientos inesperados en tiempo real

Ambas herramientas están disponibles directamente bajo el `hb.oxylabs.io` dominio, junto con tu endpoint de conexión:

* Dashboard en `hb.oxylabs.io/dashboard`
* Inspección de sesión en `hb.oxylabs.io/novnc`

{% hint style="warning" %}
**Atención:** Las herramientas de dashboard e inspección de sesión se han trasladado desde `headlesify.io` a `hb.oxylabs.io`.

Actualiza tu integración antes del **1 de octubre**. A partir de esa fecha, el tráfico a los dominios antiguos se redirigirá automáticamente a los nuevos.
{% endhint %}

## Inspección de sesiones (VNC) <a href="#session-inspection-vnc" id="session-inspection-vnc"></a>

La herramienta Session Inspection es una función de depuración que usa VNC (Virtual Network Computing) para proporcionar acceso visual en tiempo real a tus sesiones de automatización del navegador.

La forma recomendada de ver una sesión en vivo es a través del Dashboard en `hb.oxylabs.io/dashboard`, donde puedes ver las sesiones activas sin configuración adicional.

Si necesitas un enlace directo al visor (por ejemplo, para integrarlo en tus propias herramientas), puedes obtener la `hb.oxylabs.io/novnc` URL del visor a partir del ID de sesión:

```javascript
const cdp = await ctx.newCDPSession(page);
const { value: sid } = await cdp.send("__session_id");
const vncUrl = `https://hb.oxylabs.io/novnc/?id=${sid}`;
console.log(vncUrl);  // open this URL in your browser
```

{% hint style="warning" %}
**Atención:** Session Inspection se está integrando por completo en el dashboard principal. Una vez que la migración esté completa, el dashboard será el único lugar para monitorizar e inspeccionar sesiones en vivo, y esta página se actualizará en consecuencia.
{% endhint %}

Para otros clientes CDP, consulta [Integración de CDP](/products/es/agent-browser/integracion-de-cdp.md).

## Grabación de sesiones

Graba toda tu sesión de Agent Browser como un video para depuración, auditoría o revisiones. Para grabar una sesión, añade el `record=true` parámetro de consulta a tu URL de conexión:

```bash
wss://USER:PASS@hb.oxylabs.io?record=true
```

De forma predeterminada, cada cuenta puede almacenar hasta **10 grabaciones**. Si necesitas un límite mayor, contacta con el soporte de Oxylabs ([chat en vivo](https://oxylabs.io/) o [correo electrónico](mailto:support@oxylabs.io)) o a su gestor de cuenta dedicado.

{% hint style="info" %}
Al usar [**sesiones persistentes**](/products/es/agent-browser/persistent-sessions-and-profiles.md#persistent-sessions), las grabaciones se almacenan como un único video continuo en todas las reconexiones a esa sesión, en lugar de crear un archivo de grabación separado para cada conexión.
{% endhint %}

### Personalización de nombres de grabación

Organiza y filtra tus grabaciones dentro de tu dashboard asignando nombres personalizados a tus videos mediante el `record_name` parámetro. Puedes usar caracteres alfanuméricos con guiones y guiones bajos, hasta una longitud máxima de 64 caracteres (`^[a-zA-Z0-9_-]{1,64}$`):

```bash
wss://USER:PASS@hb.oxylabs.io?record=true&record_name=payment_checkout_flow_01
```

### Acceso a reproducciones

Todas las grabaciones completadas se codifican automáticamente y se guardan en tu Dashboard. Puedes buscar, filtrar, ver y eliminar tus grabaciones directamente en `hb.oxylabs.io/dashboard`.

## Ejemplos de código

El siguiente ejemplo de Node.js muestra cómo conectarse al navegador con la grabación habilitada, extraer el ID de sesión de forma programática y mostrar el enlace de inspección en vivo en tu consola.

{% hint style="success" %}
Las funciones son compatibles tanto con las bibliotecas Playwright como Puppeteer.
{% endhint %}

```javascript
import { chromium } from "playwright";

const username = "USERNAME_abc12";
const password = "PASSWORD";
const endpoint = "hb.oxylabs.io";
// Enable video recording under a custom name
const params = "record=true&record_name=chrome_vnc_test";
const browserUrl = `wss://${username}:${password}@${endpoint}?${params}`;

(async () => {
    // Connect to the browser
    const browser = await chromium.connectOverCDP(browserUrl);
    const ctx = browser.contexts()[0] || (await browser.newContext());
    const page = ctx.pages()[0] || (await ctx.newPage());
    try {
        // 1. Initialize a CDP session on the active page
        const cdpSession = await ctx.newCDPSession(page);
        
        // 2. Query the custom session identifier
        const { value: sessionId } = await cdpSession.send("__session_id");
        
        // 3. Construct and output the session inspection link
        console.log(`Live session inspection link: https://hb.oxylabs.io/novnc/?id=${sessionId}`);
        // Execute your automation steps
        await page.goto("https://example.com");
        
        // Hold session open briefly to allow visual monitoring
        await new Promise(resolve => setTimeout(resolve, 10000));
    } catch (error) {
        console.error("Visual session execution failed:", error.message);
    } finally {
        await browser.close();
        console.log("Recording compiled. Access playback at https://hb.oxylabs.io/dashboard");
    }
})();
```


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://developers.oxylabs.io/products/es/agent-browser/session-inspection-and-recording.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.