文档浏览器与 CrawlAgent Browser会话回放

会话回放

会话回放提供了一种检查已执行操作和网络请求的方式。此功能允许回放已记录的会话,从而能够逐页详细检查已执行的操作和网络请求。

优势

✅ 实时录制 —— 在脚本执行期间自动记录所有网络请求

✅ 逐帧回放 —— 精确重现浏览器操作

✅ 团队协作 —— 轻松分享会话录制以进行团队调试

✅ 毫秒级精度 —— 检查事件级时间戳,以增强脚本调优

✅ 安全隔离 —— 会话数据经过加密,并受到细粒度访问控制的保护

✅ 轻量格式 —— 借助由 rrweb 驱动的 DOM 差异对比,录制文件比视频文件小 90%

如何使用

创建 Scrapeless 浏览器会话

方式一:通过 Playground 创建会话录制

Playground 通过参数设置默认启用了会话录制。

image1.png

你也可以在 Playground 设置中启用会话录制。但请注意,一旦启用 Use Playground Settings 选项,它将覆盖 playground 代码中的连接参数。

image2.png

配置完成后,点击 “Run” 开始录制。

方式二:通过 API 创建会话录制

你也可以通过 API 在你的其他项目中接入我们的会话功能,在代码中设置会话参数。

要启用录制,请将查询参数 sessionRecording 设置为 true。默认值为 false。你还可以使用 sessionName 参数为你的会话设置名称,以便在会话列表中快速找到你的会话。

image3.png

更多详细文档,请参阅:Agent Browser API Docs。代码示例如下:

const { Scrapeless } = require('@scrapeless-ai/sdk');
const puppeteer =require('puppeteer-core');
const client = new Scrapeless({ apiKey: 'API Key' });
 
// custom fingerprint
const fingerprint = {
    platform: 'Windows',
}
 
// Create browser session and get WebSocket endpoint
const { browserWSEndpoint } = client.browser.create({
    sessionName: 'sdk_test',
    sessionTTL: 180,
    proxyCountry: 'US',
    sessionRecording: true,
    fingerprint,
});
 
(async () => {
    const browser = await puppeteer.connect({browserWSEndpoint});
    const page = await browser.newPage();
 
    await page.goto('https://www.scrapeless.com');
    await new Promise(res => setTimeout(res, 3000));
 
    await page.goto('https://www.google.com');
    await new Promise(res => setTimeout(res, 3000));
 
    await page.goto('https://www.youtube.com');
    await new Promise(res => setTimeout(res, 3000));
 
    await browser.close();
})();

查看回放

浏览器运行结束后,会话录制将被自动保存。点击会话历史列表即可查看。

image4.gif

限制

💡 会话录制仅关注用户在浏览器中的可视化体验,不包含任何底层服务器活动、数据库交互,或未反映在页面结构(DOM)中的技术变更。

💡 使用 WebGL 或 canvas 等技术构建的复杂动画,可能无法在会话录制中完美忠实地重现。