Content security policy for embedding iframes
Note: Where possible, use qlik-embed rather than this framework. Review the tutorial embedding Qlik Analytics using qlik-embed web components.
Third-party cookies: This tutorial leverages cookies for auth, which are blocked by some browser vendors. Please use an OAuth solution where possible, which doesn’t leverage cookies.
Overview
Embedding visualizations and Qlik Sense experiences in custom web applications requires a content security policy (CSP) definition in your tenant. The CSP configuration instructs your tenant to allow cross-site requests for selected web-content and protocol types from an external domain.
Content Security Policy (CSP) is a browser mechanism for mitigating and preventing cross-site scripting (XSS) attacks. Setting a CSP header in the management console enables Qlik components embedded in external web applications to render and work properly.
If your solution includes embedding Qlik Sense visualizations using iframes, the tenant hosting the analytic content must have a CSP entry. Here’s how to perform the configuration.
Configuring Qlik Cloud to allow iframe embedding in your web application
-
Open a web browser and navigate to your Qlik Cloud tenant. Once authenticated to your tenant, click the waffle icon and select Management Console.
-
Select Content Security Policy in the Integration section of the side menu. Click the Add button on the right side of the screen.
-
In the Add origin window, give the entry a name and provide the origin for the web application, for example
glitch.com). Under the origin, select theframe-ancestorsdirective.
By selecting the frame-ancestors directive, the web application with the
iframe tag containing a reference to Qlik Cloud renders the requested content.
Conclusion
In this tutorial, you learned how to configure content security policy to allow an iframe referencing content from Qlik Cloud to render properly in your web application.
For more information on content security policy in Qlik Cloud, visit help.qlik.com.
For more information on content security policy in general, visit this website on the topic.