# Session recording Copy as Markdown[Open in ChatGPT](https://chatgpt.com/?q=Read%20https%3A%2F%2Fcoralogix.com%2Fdocs%2Fuser-guides%2Frum%2Fsdk-installation%2Fjavascript%2Fbrowser-sdk%2Ffeatures%2Fsession-recording.md%20and%20help%20me%20with%20my%20question%20about%20this%20Coralogix%20documentation%20page.)[Open in Claude](https://claude.ai/new?q=Read%20https%3A%2F%2Fcoralogix.com%2Fdocs%2Fuser-guides%2Frum%2Fsdk-installation%2Fjavascript%2Fbrowser-sdk%2Ffeatures%2Fsession-recording.md%20and%20help%20me%20with%20my%20question%20about%20this%20Coralogix%20documentation%20page.) ### Session Recording[](#session-recording "Direct link to Session Recording") Session Recording enhances your user experience monitoring by enabling you to record and visually replay the web browsing activities of your users. ``` CoralogixRum.init({ // ... sessionRecordingConfig: { enable: true, // Must declare. /** * If autoStartSessionRecording is false, you can manually start & stop your session recording. * Refer to Recording Manually Section. **/ autoStartSessionRecording: true, // Automatically records your session when SDK is up. recordConsoleEvents: true, // Will record all console events from dev tools. Levels: log, debug, warn, error, info, table etc.. sessionRecordingSampleRate: 100, // Percentage of overall sessions recording being tracked, defaults to 100% and applied after the overall sessionSampleRate. immediateFlush: false, // Flush recording events immediately on start to capture short-duration sessions (<10s). Defaults to false. }, }); ``` #### Recording Manually[](#recording-manually "Direct link to Recording Manually") You can always start/stop your session recording manually as follows: ``` // To start manually the Session Recording CoralogixRum.startSessionRecording(); // To stop the Session Recording CoralogixRum.stopSessionRecording(); ``` #### Privacy & Security[](#privacy--security "Direct link to Privacy & Security") To protect your users’ privacy and sensitive information, elements containing certain class names are blocked or masked in recordings, as follows: ``` CoralogixRum.init({ // ... sessionRecordingConfig: { // .. blockClass: 'rr-block', // Use a string or RegExp to redact all elements that contain this class, defaults to rr-block. ignoreClass: 'rr-ignore', // Use a string or RegExp to Ignore all events that contain this class, defaults to rr-ignore. maskTextClass: 'rr-mask', // Use a string or RegExp to mask all elements that contain this class, defaults to rr-mask. maskAllInputs: false, // Mask all input content as * (Default false), refer to Input types. maskInputOptions: { password: true }, // Mask some kinds of input as *, By Default the SDK masking password inputs. }, }); ``` Example: ```

Dont record me

``` | Element | Action | | ---------- | -------------------------------------------------------------------------------------------------------------------------------- | | .rr-block | An element with the class name .rr-block will not be recorded. Instead, it will replay as a placeholder with the same dimension. | | .rr-ignore | An element with the class name .rr-ignore will not record its input events | | .rr-mask | All text of elements and their children will be masked. | If you want to mask all of your inputs and texts in the session, you can use the following configuration: ``` CoralogixRum.init({ // ... sessionRecordingConfig: { // ... maskAllInputs: true, maskTextSelector: '*', }, }); ``` #### Worker Url[](#worker-url "Direct link to Worker Url") By default, Session recording uses an inline web worker script to compress data before transmission. For added flexibility, you can host a custom worker script on your own domain. Simply host the following file on your server: [worker.min.js](https://cdn.rum-ingress-coralogix.com/coralogix/browser/latest/worker.min.js) For a locally hosted worker file: ``` CoralogixRum.init({ // ... sessionRecordingConfig: { // ... workerUrl: '/assets/worker.min.js', }, }); ``` For an externally hosted worker file: ``` CoralogixRum.init({ // ... sessionRecordingConfig: { // ... workerUrl: 'https://cdn.rum-ingress-coralogix.com/coralogix/browser/latest/worker.min.js', }, }); ``` #### Screenshots[](#screenshots "Direct link to Screenshots") Screenshot is a feature that allows you to capture a screenshot of the user's screen at the time of an error or based on specific custom logic triggers.
Note that the Screenshot feature is a subset of session recording and shares the same configurations, including options like masking, sample rate and others.
`sessionRecordingConfig` must be enabled to use this feature.
``` CoralogixRum.init({ // ... sessionRecordingConfig: { enable: true, // ... }, }); ``` Capture a screenshot manually: ``` CoralogixRum.screenshot(); // or with a description CoralogixRum.screenshot('Screenshot after the user logged in'); ``` Capture a screen automatically based on custom logic, using the beforeSend ``` CoralogixRum.init({ // ... beforeSend: (event) => { // ... // automatically take a screenshot when an error occurs and append the screenshot id to the event if (event.event_context.type === 'error' && event.session_context.user_name === 'CEO') { const id = CoralogixRum.screenshot('creating a screenshot due to an error!'); event.screenshotId = id; } return event; }, }); ```