For a high-level overview of what session replay is, see What Is Session Replay & Recording?

Session replay can be configured on websites and native mobile applications. Supported native mobile application platforms include:

• iOS & SwiftUI
• Android & Jetpack Compose
• React Native
• Flutter

To get started with session replay, you’ll need Admin or Architect privileges in Heap. Navigate to Account > Manage > Replay & Heatmaps. If this is your first time setting up session replay, you will see a blank page.

To get started, click the Add new site or mobile app button which will launch the setup wizard. From here, choose Web or Mobile at the top of the page to select which platform you are configuring.

Web Session Replay

What is the name of your site?

• Name: You can give your web replay collection a name. By default, this field inherits the name of the current Heap environment and project.
• Storage Location: Choose the datacenter location Heap should use to store your replays. Options include:
  • US
  • EU

Click Continue to proceed to the next step.

How many session replays should Heap collect?

Here you can choose how many session replays Heap should collect by configuring a sampling rate.

Click Continue to proceed to the next step.

What user input should Heap include in session replay and heatmaps?

In this section you can modify your session replay capture settings by configuring how Heap captures text and other content on your site.

Text and form fields

• Mask all text replaces all text content with asterisks, and Heap won’t capture the value of any form fields. This is the most conservative setting, and it is a good choice if you deal with lots of private user information. This setting will redact all text in your replays and heatmaps, regardless of your broader Heap privacy settings.
• Mask all form fields and sensitive content: Select this option if you are comfortable capturing other types of content on your website, but don’t want to capture any form fields.

By default, Heap no longer enables the capturing of form field content in session replays and heatmaps. If you need to capture this data, contact our support team for assistance.

To learn more about how Heap blocks the collection of password and credit card information, see How do I prevent session replay from capturing certain data, such as passwords and credit card numbers?

Mask additional elements

There may be other elements you want to exclude from being captured in session replay. To mask other types of elements from being captured, list their CSS selectors in this box.

Examples of elements you may want to mask include:

• A billing address on an order confirmation page.
• A user’s first and last name on an account details page. 
• Personal financial information, such as a user’s salary.

Unmask additional elements

This is helpful if you have a lot of sensitive information on your pages that require most of the content to be masked using the Mask all text setting described above, but there is still information on the page that would be valuable to capture as part of your session replay.

Examples of elements you may want to unmask include:

• Header text in banner that is often used test different messaging
• Navigation and other product UI elements

Click Continue to proceed to next step.

Which pages should replays be captured?

This setting allows you to create rules for which domains, subdomains, and/or pages you want to capture.

• Capture user activity for all domains, subdomains, and pages: This setting is selected by default; replays will be captured for all pages. 
• Block user activity for specified domains, subdomains, and/or pages: This selection allows you to create a block list of URLs that you can control from the Heap app, without using code. Replays will not be captured on the URLs that you list here.
• Allow user activity for only specified domains, subdomains, and/or pages: This selection allows you to create an allow list of URLs that you can control from the Heap app, without using code. This option will prevent data from being captured from any location that is not specified. For example, if you only want to capture public pages, you would set up those rules here.

Once you have finished, click Save and Continue.

This will open a modal asking whether you want to turn on capture for Session Replay. Click the X in the top right to close the modal and return to the configuration wizard. Click No, keep Session Replay & Heatmap off to finish your configuration but keep replay capture off. Click Turn on capture to save your settings, finish the setup, and turn on session replay capture.

After you have finished setting up your web session replay capture, a new card will appear in the Replay & Heatmaps page representing the new configuration.

After you turn on capture for Session replay it will take 30 minutes to 1 hour for sessions to populate.

Once session replay is enabled, you will see sessions in the Session replays view, the Watch Recording button in Funnels (both the main funnel view and the Top Events view), User sessions, and the definition panel for individual Events.

Mobile Session Replay

What is the name of your app?

• Name: You can give your mobile app replay collection a name. By default, this field inherits the name of the current Heap environment and project. We recommend renaming this to something easily identifiable, especially if you will be installing session replay on multiple sites and mobile apps.
• Storage Location: Choose the datacenter location Heap should use to store your replays. Options include:
  • US
  • EU

Click Continue to proceed to the next step.

How many session replays should Heap collect?

Here you can choose how many session replays Heap should collect by configuring a sampling rate.

Click Continue to proceed to the next step.

What should be your replay settings?

App ID

This section contains information needed to configure which mobile app will be sending session replay to Heap.

• App OS: Choose Android or iOS from the available options.

• Enter application IDs: This is the application or bundle ID for your app, usually in reverse domain notation. Example: com.companyname.appname. Ask your developer if unsure. Alternative, you can enter any value here and come back to this section after setting up the initial mobile configuration.

Quality Settings

This refers to the level of fidelity that should be used to record session replays when the mobile device is connected to the internet either through Cellular Networks or WiFi.

The default setting for each is Medium. We generally recommend keeping the setting equal or lower for Cellular Networks compared to WiFi.

User Consent

This setting configures whether the mobile app should require explicit user consent before recording session replay for app users. This can be used to ensure compliance with regulations.

Documentation for mobile app opt-in APIs can be found based on individual platforms:

• iOS & Swift UI
• Android & Jetpack Compose
• React Native
• Flutter

Once you have finished, click Save and Continue.

This will open a modal asking whether you to confirm your mobile app settings. Click the X or in the top right or Cancel to close the modal and return to the configuration wizard. Click Yes to save your settings, and finish setting up the mobile session replay configuration.

After you have finished setting up your mobile session replay configuration, a new card will appear in the Replay & Heatmaps page representing the new configuration.