Storybook: Add embeds from a Storybook protected by authentication/SSO

Vinh
Vinh
  • Updated

If your Storybook site is protected by authentication/SSO it may be possible to embed content from the site in a zeroheight styleguide.

For the embeds to load to viewers, the following need to be true:

Embed Storybook via the embedded iframe

The content must be embedded via the legacy embedded iframe option (it's not possible via the native embed)

Cross domain iframe embedding is enabled with SSO provider

When a viewer loads a zeroheight styleguide page, the iframe embed will redirect to the SSO provider to authenticate the user. The SSO provider needs to be configured to allow the authentication to take place via an iframe on a different domain.

Instructions for this are available for Okta and OneLogin. For other SSO providers, there needs to be a way to set zeroheight and the styleguide's custom domain as trusted domains/URLs

Storybook can be loaded in an iframe

Information on this is available here.

The viewer's browser accepts 3rd party cookies

If the SSO provider implements authentication via 3rd party cookies, the user who is viewing the styleguide needs to be using a browser that supports the setting of 3rd party cookies.

At the time of writing Chrome supports 3rd party cookies by default but Firefox and Safari block them by default.

Was this article helpful?