Browser功能会话重放

会话回放

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

优势

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

✅ 逐帧回放 – 精确追溯浏览器操作

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

✅ 毫秒级精度 – 检查事件级时间戳以增强脚本调整

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

✅ 轻量级格式 – 由于 rrweb 支持的 DOM 差异化,录制文件比视频文件小 90%

如何使用

创建 Scrapeless 浏览器会话

类型一:通过 Playground 创建会话录制

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

image1.png

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

image2.png

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

类型二:通过 API 创建会话录制

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

要启用录制,请将查询参数 session_recording 设置为 true。默认值为 false。您还可以使用 session_name 参数为会话设置名称,以便更容易地在会话列表中快速找到您的会话。

image3.png

有关更详细的文档,请参阅:Scraping Browser API 文档。代码示例如下:

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({
    session_name: 'sdk_test',
    session_ttl: 180,
    proxy_country: 'US',
    session_recording: 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 等技术构建的复杂动画可能无法在会话录制中完美地真实再现。