DeepSure PageReplay SDK

A lightweight session recording SDK for financial compliance and insurance applications.

Version 2.0.0 - Major Update

🚀 New Architecture: Simplified local recording with NDJSON format.

Key Features

• 📝 NDJSON Format: Each event is stored as a single line JSON object
• 🚀 Simplified: Removed compression and sequence number mechanisms
• 💾 Local Recording: Records to backend temporary files, uploads on completion
• ⚡ Better Performance: Reduced batch size (10 events) and faster upload interval (10s)
• 🔒 Privacy First: Built-in data masking for sensitive information
• 📊 Real-time Upload: Automatic event batching and upload

Installation

npm install @deepsure/page-replay-sdk

Quick Start

import recorder from '@deepsure/page-replay-sdk';

// Initialize the recorder
await recorder.init({
  apiKey: 'your-api-key',
  projectId: 'your-project-id',
  apiBaseUrl: 'https://api.yourplatform.com',
  chunkSize: 10,  // Batch size (default: 10)
  uploadInterval: 10000,  // Upload interval in ms (default: 10000)
  privacy: {
    maskAllInputs: false,
    maskInputOptions: {
      idCard: true,
      phone: true,
      bankCard: true,
    }
  }
});

// Recording starts automatically if autoStart is true (default)
// Or manually start:
await recorder.start({
  productType: '车险',
  userId: 'user_123'
});

// Stop recording
await recorder.stop();

Configuration Options

| Option | Type | Default | Description | |--------|------|---------|-------------| | apiKey | string | required | Your API key | | projectId | string | required | Project ID | | apiBaseUrl | string | required | API base URL | | autoStart | boolean | true | Auto-start recording | | chunkSize | number | 10 | Events per batch | | uploadInterval | number | 10000 | Upload interval (ms) | | privacy.maskAllInputs | boolean | false | Mask all inputs | | privacy.maskInputOptions | object | see below | Specific masking rules |

Privacy Options

{
  maskInputOptions: {
    idCard: true,      // Mask ID card numbers
    phone: true,       // Mask phone numbers
    bankCard: true,    // Mask bank card numbers
  }
}

API Methods

init(config)

Initialize the recorder with configuration.

start(metadata?)

Start recording with optional metadata.

stop()

Stop recording and finalize the session.

setMetadata(metadata)

Update session metadata.

getSessionId()

Get current session ID.

isRecording()

Check if recording is active.

Events

recorder.init({
  onSessionCreated: (session) => {
    console.log('Session created:', session.sessionId);
  },
  onUploadProgress: (progress) => {
    console.log('Upload progress:', progress);
  },
  onError: (message, error) => {
    console.error('Error:', message, error);
  }
});

What's New in 2.0.0

Breaking Changes

• ❌ Removed pako compression dependency
• ❌ Removed sequence number mechanism
• ❌ Changed data format from compressed base64 to plain JSON arrays
• ⚠️ Not compatible with backend < 2.0.0

Improvements

• ✅ Simplified architecture
• ✅ Better performance (no compression overhead)
• ✅ Smaller bundle size
• ✅ More reliable (local file-based recording)
• ✅ Easier debugging

Migration from 1.x

No code changes required in most cases. The SDK API remains the same.

Just upgrade to 2.0.0:

npm install @deepsure/page-replay-sdk@latest

Make sure your backend is also upgraded to 2.0.0.

Browser Support

• Chrome/Edge: ✅ Latest 2 versions
• Firefox: ✅ Latest 2 versions
• Safari: ✅ 14+
• Mobile browsers: ✅ iOS Safari 14+, Chrome Android

License

MIT

Support

For issues and questions, please contact DeepSure support or create an issue in the repository.