> 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/pt-br/agent-browser/session-inspection-and-recording.md).

# Inspeção e gravação de sessão

Veja como depurar sessões de automação do Oxylabs Agent Browser por meio de uma interface gráfica em tempo real.

Oxylabs Agent Browser fornece [**Inspeção de Sessão**](#session-inspection-vnc) e [**Gravação de sessão**](#session-recording) para observar a automação do navegador em tempo real ou revisar reproduções em vídeo de sessões passadas. Esses recursos de depuração visual permitem que você:

* diagnostique problemas complexos que não são evidentes nos logs ou mensagens de erro
* entenda a renderização da página exatamente como o navegador a vê
* verifique a execução correta dos seus fluxos de trabalho de automação
* solucione comportamentos inesperados em tempo real

Ambas as ferramentas estão disponíveis diretamente no `hb.oxylabs.io` domínio, junto ao seu endpoint de conexão:

* Painel em `hb.oxylabs.io/dashboard`
* Inspeção de sessão em `hb.oxylabs.io/novnc`

{% hint style="warning" %}
**Atenção:** As ferramentas de painel e inspeção de sessão foram movidas de `headlesify.io` para `hb.oxylabs.io`.

Atualize sua integração até **1º de outubro**. A partir dessa data, o tráfego para os domínios antigos será automaticamente redirecionado para os novos.
{% endhint %}

## Inspeção de sessão (VNC) <a href="#session-inspection-vnc" id="session-inspection-vnc"></a>

A ferramenta Session Inspection é um recurso de depuração que usa VNC (Virtual Network Computing) para fornecer acesso visual em tempo real às suas sessões de automação do navegador.

A maneira recomendada de assistir a uma sessão ao vivo é pelo painel em `hb.oxylabs.io/dashboard`, onde você pode visualizar sessões ativas sem nenhuma configuração extra.

Se você precisar de um link direto do visualizador (por exemplo, para incorporar em sua própria ferramenta), você pode recuperar a `hb.oxylabs.io/novnc` URL do visualizador a partir do ID da sessão:

```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" %}
**Atenção:** Session Inspection está sendo totalmente integrada ao painel principal. Assim que a migração for concluída, o painel será o único lugar para monitorar e inspecionar sessões ao vivo, e esta página será atualizada de acordo.
{% endhint %}

Para outros clientes CDP, veja [Integração com CDP](/products/pt-br/agent-browser/integracao-com-cdp.md).

## Gravação de sessão

Grave toda a sua sessão do Agent Browser em vídeo para depuração, auditoria ou revisões. Para gravar uma sessão, adicione o `record=true` parâmetro de consulta à sua URL de conexão:

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

Por padrão, cada conta pode armazenar até **10 gravações**. Se precisar de um limite maior, entre em contato com o suporte da Oxylabs ([chat ao vivo](https://oxylabs.io/) ou [e-mail](mailto:support@oxylabs.io)) ou com seu Gerente de Conta Dedicado.

{% hint style="info" %}
Ao usar [**sessões persistentes**](/products/pt-br/agent-browser/persistent-sessions-and-profiles.md#persistent-sessions), as gravações são armazenadas como um único vídeo contínuo em todas as reconexões a essa sessão, em vez de criar um arquivo de gravação separado para cada conexão.
{% endhint %}

### Personalizando nomes de gravação

Organize e filtre suas gravações no seu painel atribuindo nomes personalizados aos seus vídeos usando o `record_name` parâmetro. Você pode usar caracteres alfanuméricos com hífens e underscores, até um comprimento máximo de 64 caracteres (`^[a-zA-Z0-9_-]{1,64}$`):

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

### Acessando reproduções

Todas as gravações concluídas são codificadas e salvas automaticamente no seu painel. Você pode pesquisar, filtrar, visualizar e excluir suas gravações diretamente em `hb.oxylabs.io/dashboard`.

## Exemplos de código

O exemplo a seguir em Node.js mostra como se conectar ao navegador com a gravação ativada, extrair o ID da sessão programaticamente e exibir o link de inspeção ao vivo no seu console.

{% hint style="success" %}
Os recursos oferecem suporte às bibliotecas Playwright e 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/pt-br/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.
