Configuration
If you have any questions, feedback or would like to report a bug, please open a GitHub issue with a link to a relevant replay or, if possible, a publicly accessible URL to the page you're attempting to record a replay of.
General Integration Configuration
The following options can be configured on the root level of your browser-based Sentry SDK, in init({})
:
Key | Type | Default | Description |
---|---|---|---|
replaysSessionSampleRate | number | 0 | The sample rate for replays that begin recording immediately and last the entirety of the user's session. 1.0 collects all replays, and 0 collects none. |
replaysOnErrorSampleRate | number | 0 | The sample rate for replays that are recorded when an error happens. This type of replay will record up to a minute of events prior to the error and continue recording until the session ends. 1.0 captures all sessions with an error, and 0 captures none. |
The following can be configured as integration options in new Replay({})
:
Key | Type | Default | Description |
---|---|---|---|
stickySession | boolean | true | Keep track of users across page loads. Note, because closing a tab ends the session, a single user using multiple tabs will be recorded as multiple sessions. |
mutationLimit | number | 10000 | The upper bound of mutations to process before Session Replay stops recording due to performance impacts. See Mutation Limits |
mutationBreadcrumbLimit | number | 750 | The upper bound of mutations to process before Session Replay sends a breadcrumb to warn of large mutations. See Mutation Limits |
networkDetailAllowUrls | (string | RegExp)[] | [] | Capture request and response details for XHR and fetch requests that match the given URLs. |
networkCaptureBodies | boolean | true | Decide whether to capture request and response bodies for URLs defined in networkDetailAllowUrls . |
networkRequestHeaders | string[] | [] | Additional request headers to capture for URLs defined in networkDetailAllowUrls . See Network Details to learn more. |
networkResponseHeaders | string[] | [] | Additional response headers to capture for URLs defined in networkDetailAllowUrls . See Network Details to learn more. |
Sampling
To learn more about how session sampling works, check out our Default Session Initialization docs.
Network Details
By default, Replay will capture basic information about all outgoing fetch and XHR requests in your application. This includes the URL, request and response body size, method, and status code. The intention is to limit the chance of collecting private data.
To capture additional information such as request and response headers or bodies, you'll need to opt-in via networkDetailAllowUrls
(requires SDK version >= 7.50.0). This will make it possible for you to elect to only add URLs that are safe for capturing bodies and avoid any endpoints that may contain Personal Identifiable Information, (PII).
Content in bodies will be PII-sanitized server-side, based on object keys and values. Refer to our Replay Privacy section for more details.
Any URL matching the given pattern(s) will then be captured with additional details:
new Replay({
networkDetailAllowUrls: [window.location.origin],
});
If you give us a string, we'll match any URL that contains that string. You can use a regex to handle exact or more complex matches.
Requests to a URL matched by the configured patterns will be enhanced with the request and response body, as well as the following default headers:
Content-Type
Content-Length
Accept
If you want to capture additional headers, you'll have to configure them with the options networkRequestHeaders
and networkResponseHeaders
, for example:
new Replay({
networkDetailAllowUrls: [window.location.origin],
networkRequestHeaders: ["Cache-Control"],
networkResponseHeaders: ["Referrer-Policy"],
});
Mutation Limits
Session Replay works by recording incremental DOM changes that occur in your web application. Generally these changes occur in small batches and cause minimal overhead. However, it can be easy to overlook cases that will cause a large amount of DOM mutations to happen in a single update. An example is a custom dropdown component that has an unbounded list of options to render. This can negatively impact performance without Session Replay and its effects will be magnified with Session Replay enabled. In order to avoid this scenario, Session Replay will stop recording if it detects a large number of mutations (default: 10,000), which can be configured by setting mutationLimit
. Additionally, we provide breadcrumbs in the replay to warn you when a large number of mutations are detected (default: 750).
new Replay({
mutationBreadcrumbLimit: 1000,
mutationLimit: 1500,
});
Identifying Users
You can use the Sentry SDK to link a user to a session. Read more about it in our docs.
Sentry.setUser({ email: "jane.doe@example.com" });
Privacy
We take privacy seriously, so we provide a number of privacy-oriented settings. Learn more about these in our our Session Replay privacy documentation.
Our documentation is open source and available on GitHub. Your contributions are welcome, whether fixing a typo (drat!) to suggesting an update ("yeah, this would be better").
- Package:
- npm:@sentry/react
- Version:
- 7.54.0
- Repository:
- https://github.com/getsentry/sentry-javascript