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

# 会话检查与录制

了解如何通过实时图形界面调试自动化会话。

Oxylabs 无头浏览器提供 [**会话检查**](#session-inspection-vnc) 和 [**会话录制**](#session-recording) 可用于实时观察浏览器自动化，或回看过去会话的视频回放。这些可视化调试功能可帮助你：

* 诊断仅凭日志或错误消息无法显现的复杂问题
* 准确了解页面在浏览器中呈现的样子
* 验证自动化工作流是否正确执行
* 实时排查意外行为

这两种工具可直接在 `hb.oxylabs.io` 域名下使用，与你的连接端点并列：

* 仪表板地址： `hb.oxylabs.io/dashboard`
* 会话检查地址： `hb.oxylabs.io/novnc`

{% hint style="warning" %}
**注意：** 仪表板和会话检查工具已从 `headlesify.io` 迁移到 `hb.oxylabs.io`.

请在 **10月1日**前更新你的集成。从那天起，对旧域名的流量将自动路由到新域名。
{% endhint %}

## 会话检查 (VNC) <a href="#session-inspection-vnc" id="session-inspection-vnc"></a>

会话检查工具是一项调试功能，它使用 VNC（Virtual Network Computing）为你的浏览器自动化会话提供实时可视访问。

推荐的实时会话查看方式是通过 `hb.oxylabs.io/dashboard`处的仪表板，在那里你无需任何额外设置即可查看活动会话。

如果你需要直接的查看器链接（例如嵌入到你自己的工具中），你可以获取 `hb.oxylabs.io/novnc` 从会话 ID 获取查看器 URL：

```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" %}
**注意：** 会话检查正全面集成到主仪表板中。迁移完成后，仪表板将成为监控和检查实时会话的唯一位置，此页面将相应更新。
{% endhint %}

## 会话录制

将你的整个无头浏览器会话录制为视频，以用于调试、审计或复核。要录制会话，请添加 `record=true` 查询参数到你的连接 URL：

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

默认情况下，每个账户最多可存储 **10 条录制**. 如果你需要更高上限，请联系 Oxylabs 支持（[在线聊天](https://oxylabs.io/) 或 [电子邮件](mailto:support@oxylabs.io)）或你的专属客户经理。

{% hint style="info" %}
在使用 [**持久会话**](/products/cn/headless-browser/persistent-sessions-and-profiles.md#persistent-sessions)时，录制内容会在该会话的所有重连之间作为一段连续视频保存，而不是为每次连接创建单独的录制文件。
{% endhint %}

### 自定义录制名称

通过使用 `record_name` 参数为视频指定自定义名称，在仪表板中整理和筛选你的录制。你可以使用字母数字字符，连字符和下划线，最长 64 个字符（`^[a-zA-Z0-9_-]{1,64}$`):

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

### 访问回放

所有已完成的录制都会自动编码并保存到你的仪表板。你可以直接在 `hb.oxylabs.io/dashboard`.

## 代码示例

下面的 Node.js 示例展示了如何在启用录制的情况下连接到浏览器，编程式提取会话 ID，并将实时检查链接输出到控制台。

{% hint style="success" %}
该功能同时支持 Playwright 和 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();
        录制已生成。请访问 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/cn/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.
