Can FullStory capture content that is presented in iframes?

Yes, FullStory can work seamlessly with iframes!

Usually, iframes should just work. However, if you're finding that iframed content is not represented in your playbacks correctly you may need to make a few minor tweaks.

One caveat: If you have content in an iframe for which you do not have access to the code, you will not be able to record the contents of that iframe. One example of this may be a support widget within your application.

Here are some scenarios where iframe recording should work. In the following scenarios, "outer page" refers to the top-most html page, the one not running in an iframe, or window.top.

1) The outer page is running FullStory and all your iframes run on the same domain.

For example, you run a single-domain site, and use iframes to organize various components.

What to do: You don't need to do anything special. Run FullStory on the outer page, and everything should get recorded.  If you also have the FullStory recording snippet inside your iframes, that's ok too; the recording script within the iframes will automatically defer to the outer page.


2) The outer page is running FullStory and you have iframes running on a different domain.

For example, you have a mixed-domain site that uses iframes, but logically it's all part of a single application and you want everything recorded together.  (Note: Click here for a detailed explanation of what "cross-origin" means)

What to do: Put the FullStory recording snippet on the outer page.  Then inside of the iframe, include the FullStory recording snippet again and add this special flag to the script:

window['_fs_run_in_iframe'] = true;

So the resulting iframe script will look something like:

window['_fs_run_in_iframe'] = true;   //  <-- here is the new variable to add, only inside the iframe
window['_fs_debug'] = false;
window['_fs_host'] = 'www.fullstory.com';
(etc...)

The _fs_run_in_iframe flag tells FullStory that the iframe should record itself and be a slave to the outer page that is also running FullStory, so they show up together in a single recording.  Again, this is only necessary if the iframe is cross-origin with respect to the outer page.

IMPORTANT SECURITY NOTE:

If you are manually configuring window['_fs_run_in_iframe'] = true; so that your cross domain page runs in the context of another embedding master page that is also running FullStory. You NEED to configure your Content Security Policy HTTP headers (specifically the frame-ancestors directive) for that page so that you can control what domains are allowed to embed your website. Failure to do so will put you at risk of loosening some of the cross domain IFrame protections that the browser gives you. 


3) The outer page does not run FullStory and you want to record a page that runs in an iframe.

For example, you provide content in an iframe, which is embedded into a third-party site that doesn't use FullStory.

What to do: Inside of the iframe, include the usual FullStory recording snippet and add this special flag to the script:

window['_fs_is_outer_script'] = true;

So the resulting iframe script will look something like:

window['_fs_is_outer_script'] = true;   //  <-- here is the new variable to add, only inside the iframe
window['_fs_debug'] = false;
window['_fs_host'] = 'www.fullstory.com';
(etc...)

The _fs_is_outer_script flag tells FullStory that the iframe is the "root" of the recording, and should be its own session.


4) You want to record a page that runs in an iframe into your FullStory account, but the outer page is recording into a different FullStory account.

For example, maybe you provide content in an iframe, and it's embedded into a third-party site which also happens to be using FullStory, but they have their own FullStory account that's different from yours.

What to do: Follow the instructions from part 3, using the _fs_is_outer_script flag inside the iframe.  The outer page will record itself into one FullStory account, which will render the iframe as an empty box.  The iframe will record itself into a different FullStory account, and all you'll see is the iframe itself, not the content around it.  There is no way to see all the content together in this scenario.

Can’t find what you’re looking for?

The FullStory team awaits your every question.

Contact Us