본문으로 건너뛰기

재생

세션 리플레이는 사용자의 화면이 실제로 한 일을 기록합니다: 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.