Session Replay Privacy Best Practices
Session replay tools provide valuable insights into user behavior, but they can pose significant privacy risks when not properly configured. These tools record user interactions like videos, capturing sensitive information such as form data, personal details, and confidential content.
This guide covers essential best practices for implementing session replay tools while protecting user privacy and ensuring regulatory compliance.
Table of Contents
- Understanding Session Replay Privacy Risks
- Essential Privacy Configuration
- Consent Management Integration
- Implementation Testing
- Platform-Specific Configurations
- Industry-Specific Considerations
- Monitoring and Maintenance
- Common Mistakes to Avoid
- Compliance Requirements
- Conclusion
Understanding Session Replay Privacy Risks
What Gets Recorded
Session replay tools capture:
- Mouse movements and clicks: Every interaction on the page
- Form inputs: Text entered into input fields
- Scrolling behavior: How users navigate through content
- Page interactions: Button clicks, dropdown selections, etc.
- Sensitive data: Personal information, passwords, financial data
Privacy Concerns
- Data exposure: Sensitive information sent to third-party servers
- Compliance violations: Potential breaches of GDPR, CCPA, HIPAA, etc.
- User trust: Privacy violations damage customer relationships
- Legal liability: Non-compliance can result in significant fines
Essential Privacy Configuration
1. Field Masking and Exclusion
Most session replay tools provide privacy configuration options to mask or exclude sensitive fields.
CSS Class-Based Masking
The most common approach uses CSS classes to identify sensitive fields:
<!-- Sensitive fields should be masked -->
<input type="text" class="masked" name="ssn" placeholder="Social Security Number">
<input type="password" class="sensitive" name="password">
<input type="email" class="pii" name="email" placeholder="Email Address">
<textarea class="private" name="medical-history">Medical information...</textarea>
Common Masking Classes
Different tools use different class names:
Hotjar:
.hotjar-mask
.hotjar-exclude
FullStory:
.fs-mask
.fs-exclude
LogRocket:
.logrocket-mask
.logrocket-exclude
Mouseflow:
.mouseflow-mask
.mouseflow-exclude
Smartlook:
.smartlook-mask
.smartlook-exclude
2. Configuration Best Practices
Sensitive Field Identification
Create a comprehensive list of fields that should be masked:
// Example configuration for sensitive fields
const sensitiveFields = [
'password', 'ssn', 'credit-card', 'cvv', 'bank-account',
'medical-record', 'insurance-id', 'driver-license',
'phone', 'address', 'date-of-birth', 'social-security'
];
// Apply masking classes dynamically
sensitiveFields.forEach(field => {
const elements = document.querySelectorAll(`[name*="${field}"], [id*="${field}"]`);
elements.forEach(el => el.classList.add('session-replay-mask'));
});
Page-Level Exclusions
Exclude entire pages that contain sensitive information:
// Exclude sensitive pages from recording
const excludedPages = [
'/checkout/payment',
'/account/personal-info',
'/medical/records',
'/financial/statements',
'/admin/dashboard'
];
if (excludedPages.some(page => window.location.pathname.includes(page))) {
// Disable session replay on this page
sessionReplayTool.disable();
}
3. Data Sanitization
Text Replacement
Replace sensitive text with placeholders:
// Replace sensitive patterns
const sanitizeText = (text) => {
return text
.replace(/\b\d{3}-\d{2}-\d{4}\b/g, '[SSN]') // Social Security Numbers
.replace(/\b\d{4}[\s-]?\d{4}[\s-]?\d{4}[\s-]?\d{4}\b/g, '[CARD]') // Credit Cards
.replace(/\b[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Z|a-z]{2,}\b/g, '[EMAIL]'); // Email addresses
};
Element Content Masking
// Mask sensitive content in elements
const maskSensitiveContent = () => {
const sensitiveElements = document.querySelectorAll('.sensitive-content');
sensitiveElements.forEach(el => {
el.setAttribute('data-original-content', el.textContent);
el.textContent = '[MASKED CONTENT]';
});
};
Consent Management Integration
Critical Requirement: Consent-Based Activation
⚠️ Essential: Session replay tools must only be active when users have provided explicit consent.
Consent Check Implementation
// Only initialize session replay if consent is given
function initializeSsionReplay() {
// Check consent status
if (hasConsent('analytics') && hasConsent('session-replay')) {
// Initialize session replay tool
sessionReplayTool.init({
// Privacy configuration
maskAllInputs: false,
maskInputOptions: {
password: true,
email: true,
creditCard: true,
ssn: true
},
// Additional privacy settings
respectDoNotTrack: true,
excludePages: sensitivePages
});
} else {
// Ensure session replay is disabled
sessionReplayTool.disable();
}
}
OneTrust Integration Example
// OneTrust consent integration
function oneTrustConsentChange() {
const consent = OnetrustActiveGroups.split(',');
if (consent.includes('C0002')) { // Analytics consent
initializeSsionReplay();
} else {
sessionReplayTool.disable();
}
}
// Listen for consent changes
document.addEventListener('OneTrustGroupsUpdated', oneTrustConsentChange);
Cookiebot Integration Example
// Cookiebot consent integration
function onCookiebotConsentChange() {
if (Cookiebot.consent.statistics) {
initializeSsionReplay();
} else {
sessionReplayTool.disable();
}
}
// Listen for consent changes
window.addEventListener('CookiebotOnConsentReady', onCookiebotConsentChange);
Consent Categories
Session replay typically falls under these consent categories:
- Analytics: General analytics and performance monitoring
- Marketing: User behavior analysis for marketing purposes
- Functional: Essential website functionality (usually not applicable)
Implementation Testing
1. Privacy Configuration Testing
Field Masking Verification
// Test function to verify field masking
function testFieldMasking() {
const testFields = [
'input[type="password"]',
'input[name*="ssn"]',
'input[name*="credit"]',
'.sensitive-field'
];
testFields.forEach(selector => {
const fields = document.querySelectorAll(selector);
fields.forEach(field => {
if (!field.classList.contains('session-replay-mask')) {
console.warn(`Field not masked: ${selector}`);
}
});
});
}
Recording Verification
// Verify that sensitive data is not being recorded
function verifyRecordingPrivacy() {
// Check if session replay is active
if (sessionReplayTool.isActive()) {
// Test with dummy sensitive data
const testInput = document.createElement('input');
testInput.type = 'text';
testInput.value = 'TEST-SENSITIVE-DATA';
testInput.classList.add('session-replay-mask');
// Verify the tool respects masking
const recordedValue = sessionReplayTool.getRecordedValue(testInput);
if (recordedValue !== '[MASKED]') {
console.error('Sensitive data is being recorded!');
}
}
}
2. Consent Testing
Consent Banner Testing
// Test consent scenarios
function testConsentScenarios() {
// Test 1: Accept all
simulateConsent('accept-all');
if (!sessionReplayTool.isActive()) {
console.error('Session replay not active after accepting all');
}
// Test 2: Reject all
simulateConsent('reject-all');
if (sessionReplayTool.isActive()) {
console.error('Session replay still active after rejecting all');
}
// Test 3: Partial consent
simulateConsent('analytics-only');
if (!sessionReplayTool.isActive()) {
console.error('Session replay not active with analytics consent');
}
}
Global Privacy Control (GPC) Testing
// Test GPC signal handling
function testGPCCompliance() {
// Simulate GPC signal
Object.defineProperty(navigator, 'globalPrivacyControl', {
value: true,
writable: false
});
// Verify session replay is disabled
if (sessionReplayTool.isActive()) {
console.error('Session replay active despite GPC signal');
}
}
3. Automated Testing
Privacy Audit Script
// Comprehensive privacy audit
function runPrivacyAudit() {
const auditResults = {
consentCompliance: false,
fieldMasking: false,
pageExclusions: false,
gpcCompliance: false
};
// Check consent compliance
auditResults.consentCompliance = checkConsentCompliance();
// Check field masking
auditResults.fieldMasking = checkFieldMasking();
// Check page exclusions
auditResults.pageExclusions = checkPageExclusions();
// Check GPC compliance
auditResults.gpcCompliance = checkGPCCompliance();
return auditResults;
}
Platform-Specific Configurations
Hotjar
Privacy Configuration
// Hotjar privacy settings
hj('config', {
// Mask sensitive fields
maskAllInputs: false,
maskInputOptions: {
password: true,
email: true,
creditCard: true,
ssn: true
},
// Exclude sensitive pages
excludePages: ['/checkout', '/account', '/admin'],
// Respect Do Not Track
respectDoNotTrack: true
});
CSS Classes
/* Hotjar masking classes */
.hotjar-mask {
/* Field will be masked in recordings */
}
.hotjar-exclude {
/* Element will be excluded from recordings */
}
FullStory
Privacy Configuration
// FullStory privacy settings
FS('config', {
// Mask sensitive fields
maskAllInputs: false,
maskInputOptions: {
password: true,
email: true,
creditCard: true,
ssn: true
},
// Exclude sensitive pages
excludePages: ['/checkout', '/account', '/admin'],
// Respect Do Not Track
respectDoNotTrack: true
});
CSS Classes
/* FullStory masking classes */
.fs-mask {
/* Field will be masked in recordings */
}
.fs-exclude {
/* Element will be excluded from recordings */
}
LogRocket
Privacy Configuration
// LogRocket privacy settings
LogRocket.init('your-app-id', {
// Mask sensitive fields
maskAllInputs: false,
maskInputOptions: {
password: true,
email: true,
creditCard: true,
ssn: true
},
// Exclude sensitive pages
excludePages: ['/checkout', '/account', '/admin'],
// Respect Do Not Track
respectDoNotTrack: true
});
CSS Classes
/* LogRocket masking classes */
.logrocket-mask {
/* Field will be masked in recordings */
}
.logrocket-exclude {
/* Element will be excluded from recordings */
}
Industry-Specific Considerations
Healthcare Websites
HIPAA Compliance
- Patient data protection: Mask all medical information
- Consent requirements: Explicit consent for any recording
- Audit trails: Maintain records of privacy configurations
Sensitive Fields
const healthcareSensitiveFields = [
'medical-record', 'patient-id', 'diagnosis', 'treatment',
'insurance-id', 'prescription', 'symptoms', 'allergies'
];
Financial Services
GLBA Compliance
- Financial data protection: Mask account numbers, balances
- Transaction data: Exclude payment processing pages
- Customer information: Protect personal financial details
Sensitive Fields
const financialSensitiveFields = [
'account-number', 'routing-number', 'balance', 'transaction',
'credit-score', 'loan-amount', 'payment-info', 'tax-id'
];
E-commerce
PCI DSS Compliance
- Payment data: Mask credit card information
- Checkout process: Exclude payment pages
- Customer data: Protect personal information
Sensitive Fields
const ecommerceSensitiveFields = [
'credit-card', 'cvv', 'billing-address', 'shipping-address',
'phone', 'email', 'payment-method', 'order-total'
];
Monitoring and Maintenance
Regular Privacy Audits
Monthly Checklist
- Verify consent management is working
- Test field masking on sensitive pages
- Check page exclusions are active
- Verify GPC signal handling
- Review recorded data for privacy violations
Quarterly Review
- Update sensitive field lists
- Review consent categories
- Test new privacy features
- Update documentation
- Train team on privacy practices
Privacy Monitoring
Automated Alerts
// Set up privacy monitoring alerts
function setupPrivacyMonitoring() {
// Monitor for unmasked sensitive fields
setInterval(() => {
const unmaskedFields = findUnmaskedSensitiveFields();
if (unmaskedFields.length > 0) {
alert('Unmasked sensitive fields detected!');
}
}, 60000); // Check every minute
// Monitor consent compliance
setInterval(() => {
if (!checkConsentCompliance()) {
alert('Consent compliance issue detected!');
}
}, 30000); // Check every 30 seconds
}
Common Mistakes to Avoid
1. Incomplete Field Masking
- Problem: Not masking all sensitive fields
- Solution: Comprehensive field identification and testing
2. Consent Bypass
- Problem: Session replay active without consent
- Solution: Strict consent checking before initialization
3. Page Exclusion Failures
- Problem: Sensitive pages still being recorded
- Solution: Regular testing of page exclusions
4. Configuration Drift
- Problem: Privacy settings not maintained over time
- Solution: Regular audits and monitoring
5. Testing Gaps
- Problem: Not testing privacy configurations
- Solution: Comprehensive testing procedures
Compliance Requirements
GDPR (General Data Protection Regulation)
- Lawful basis: Consent required for session replay
- Data minimization: Only collect necessary data
- User rights: Provide opt-out mechanisms
- Data protection: Implement appropriate safeguards
CCPA/CPRA (California Consumer Privacy Act)
- Disclosure: Inform users about data collection
- Opt-out rights: Provide easy opt-out mechanisms
- Data protection: Implement reasonable security measures
- GPC compliance: Respect Global Privacy Control signals
HIPAA (Health Insurance Portability and Accountability Act)
- Business Associate Agreements: Ensure proper agreements
- Minimum necessary: Limit data collection
- Safeguards: Implement appropriate protections
- Audit controls: Maintain audit trails
Conclusion
Implementing session replay tools with proper privacy protection requires:
- Comprehensive Configuration: Mask all sensitive fields and exclude sensitive pages
- Consent Management: Only activate when users provide explicit consent
- Regular Testing: Verify privacy configurations are working correctly
- Ongoing Monitoring: Maintain privacy protections over time
- Compliance Awareness: Understand and meet regulatory requirements
By following these best practices, you can leverage session replay insights while protecting user privacy and maintaing regulatory compliance.
Rember: Privacy by design is not just a best practice—it's a legal requirement and essential for maintaing user trust.
For additional guidance on implementing session replay privacy protections, consult with your legal team and privacy professionals to ensure compliance with applicable regulations.