Configuring Content Security Policy (CSP) for Guides & Surveys

Fullstory Guides & Surveys is in Early Access. If you would like to evaluate Guides & Surveys, please reach out to a member of your account team.

Who can use this feature?
- Part of Guides & Surveys, an add-on for Business, Advanced, and Enterprise plans.
- Requires an Admin, Architect, or Standard role to configure.

Because Guides & Surveys is in Early Access, product functionality and documentation may change without notice.

To integrate Guides & Surveys securely on your website, you need to configure a Content Security Policy (CSP) that allows the necessary resources while maintaining security. This guide provides detailed instructions and explanations for each CSP rule required to enable Guides & Surveys effectively.

Required CSP configuration

Add the following directives to your Content Security Policy header:

script-src 'self' https://guides.fullstory.com https://guides-cdn.fullstory.com;
style-src 'self' 'unsafe-inline' https://guides.fullstory.com;
img-src 'self' https://guides-cdn.fullstory.com;
connect-src 'self' https://guides.fullstory.com;

Understanding each directive

script-src

Purpose: The script-src directive controls which sources can execute scripts on your page.

Required values:

  • 'self' - Permits scripts to be loaded from the same origin as the page, ensuring that only trusted scripts from your server are executed.
  • https://guides.fullstory.com - Permits scripts from the Guides & Surveys subdomain.
  • https://guides-cdn.fullstory.com - Permits scripts from the Guides & Surveys CDN for future use.

This configuration allows Guides & Surveys scripts to function correctly without compromising your server's security by restricting script sources.

style-src

Purpose: The style-src directive specifies which sources can provide stylesheets.

Required values:

  • 'self' - Allows styles from the same origin, ensuring that your styles are used without external interference.
  • 'unsafe-inline' - Allows inline styles, which are necessary for rendering Guides & Surveys correctly. For example, the highlight elements require dynamic height and width calculations that are set as inline styles for overlay elements.
  • https://guides.fullstory.com - Enables styles from the Guides & Surveys subdomain, ensuring that all necessary styles are applied.

Security note: While inline styles can present a security risk, they are required for Guides & Surveys to function properly. To improve security, consider using a nonce or hash to specify which inline styles are allowed. See MDN's style-src documentation for more information.

img-src

Purpose: The img-src directive defines which sources can load images.

Required values:

  • 'self' - Permits images to be loaded from the same origin, ensuring that only images from your server are displayed.
  • https://guides-cdn.fullstory.com - Allows images uploaded via the Guides & Surveys editor to be loaded from the CDN subdomain, ensuring that all visual content is correctly displayed.

connect-src

Purpose: The connect-src directive specifies allowed sources for fetching data.

Required values:

  • 'self' - Allows connections only to your own server for enhanced security.
  • https://guides.fullstory.com - Permits connections to the Guides & Surveys subdomain for secure integration.

Next steps

After configuring your CSP rules, test your Guides & Surveys implementation to ensure all features work as expected. If you encounter any issues, verify that all required directives have been added correctly to your Content Security Policy header.


Was this article helpful?

Got Questions?

Get in touch with a Fullstory rep, ask the community or check out our developer documentation.