跳到主要内容

会话回放

会话回放记录用户屏幕真实发生的事情：DOM 变化与交互，由 SDK 分块捕获，在控制台中回看。录制按客户端可选开启，输入默认打码，打码录制的会话在任何展示处都会说明。

At a glance

Enable
createWebClient({ sessionReplay: true, replayHost })
Intake
POST /v1/replay, chunked, project key
Read
replaySessions, replayChunks over GraphQL
Masking
Inputs masked by default, client-side
Auth
Project key to record, access token to watch
  • 分块捕获：录制端接收编号的块，中途关闭的标签页仍留下已发送的一切。
  • 打码在客户端完成：被打码的内容从不离开浏览器，而不是在显示时才隐藏。
  • 播放链接刻意短寿命；过期的链接通过重新加载重新签发，而不是静默失败。

工作原理

The web SDK records DOM mutations and interactions, serialises them into numbered chunks and posts each chunk to the recorder with the project key, flushing on an interval and on page hide. The replay processor stores the chunks with their session metadata: whose session, how many events, whether masking was on. The console lists sessions and plays one back by fetching its chunks through short-lived links, in order, so a recording streams rather than downloading whole.

如何访问

SurfaceOperation
RESTPOST /v1/replay (recorder intake, project key)
GraphQLreplaySessions, replayChunks queries
RealtimeNone: session lists read on demand
MCPNone

示例

TypeScript
import { createWebClient } from '@prodantix/sdk/web';

const prodantix = createWebClient({
  apiKey: process.env.PRODANTIX_KEY,
  replayHost: 'eu.replay.prodantix.com',
  sessionReplay: true,
  // Inputs are masked by default; widen or narrow with sessionReplayOptions.mask.
});

Replay is a web SDK capability: recording needs a DOM, so the Dart and Python SDKs do not carry it. Watching back happens on the Replay screen.