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

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

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

Oxylabs Headless Browser oferece [**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 em 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 automação
* Solucione comportamentos inesperados em tempo real

Ambas as ferramentas estão disponíveis diretamente no `hb.oxylabs.io` domínio, junto com o 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 de inspeção de sessão foram movidas form `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 de Inspeção de Sessão é 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 ver sessões ativas sem nenhuma configuração extra.

Se precisar de um link direto do visualizador (por exemplo, para incorporar em sua própria ferramenta), você pode obter o `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:** A Inspeção de Sessão está sendo totalmente integrada ao painel principal. Quando a migração estiver 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 %}

## Gravação de Sessão

Grave toda a sua sessão do Headless Browser como um 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/headless-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 sublinhados, 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 automaticamente e salvas 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 gravação ativada, extrair o ID da sessão programaticamente e exibir o link de inspeção ao vivo no console.

{% hint style="success" %}
Os recursos são compatíveis com as 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 dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://developers.oxylabs.io/products/pt-br/headless-browser/session-inspection-and-recording.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.