iframes

LogRocket supports playback of same-domain iframes as part of your session recordings.

In order to view iframe playback within your session recording, you must include a LogRocket.init() call within your iframe code as well as your main application code.

Then, within both LogRocket.init() calls, you must include the option mergeIframes: true:

LogRocket.init(YOUR_APP_ID, {
  mergeIframes: true,
});

See here for more information on the mergeIframes option.

Cross-domain iframes

For security purposes, two additional configuration variables are required to merge cross-domain iframe recordings into their parent windows' recordings.

For the outer window, you must include the childDomains option in the LogRocket.init() call, indicating the domains of all frames embedded in it -- whether they are the same as or different from the domain of that window:

LogRocket.init(YOUR_APP_ID, {
  mergeIframes: true,
  childDomains: ['https://example.child_frame_domain.com', 'https://example.parent_window_domain.com'],
});

In the embedded iframes' code, you must include the parentDomain option in LogRocket.init() call, indicating the domain of the window in which the iframe is embedded:

LogRocket.init(YOUR_APP_ID, {
  mergeIframes: true,
  parentDomain: 'https://example.parent_window_domain.com',
});

Playback Details

The network requests and logging information from within the iframe will be recorded and shown as normal within the developer pane during session playback.

Subdomains

LogRocket supports recording and playback of iframes running on subdomains.

Follow the instructions here to include the rootHostname in your init() call. This should be included in both the main application as well as the iframe code.

Please note that iframes running on a different root or subdomain, or on a third-party domain are not supported.