Embed to Website: Difference between revisions
No edit summary |
(Added required change details on Cross-Origin-Opener-Policy header.) |
||
| (4 intermediate revisions by one other user not shown) | |||
| Line 1: | Line 1: | ||
QPR ProcessAnalyzer can be embedded to another website, such as Microsoft Sharepoint. The embedding is based on the ''iframe'' html element. By default, QPR ProcessAnalyzer only | QPR ProcessAnalyzer can be embedded to another website, such as Microsoft Sharepoint. The embedding is based on the ''iframe'' html element. By default, QPR ProcessAnalyzer only allows to be embedded by a website in the same origin that is restricted by the Content-Security-Policy HTTL header. More information how to change the CSP setting in [[QPR_ProcessAnalyzer_Security_Hardening#HTTP_Response_Headers|Security Hardening]]. Note also the special behavior when using the [[#Using_SAML_authentication_with_embedding|SAML authentication with embedding]]. | ||
== Example webpage == | == Example embedding webpage == | ||
This is a simple example page containing an iframe element that embeds QPR ProcessAnalyzer. | This is a simple example page containing an iframe element that embeds QPR ProcessAnalyzer. | ||
| Line 14: | Line 14: | ||
== Change CSP frame-ancestors setting == | == Change CSP frame-ancestors setting == | ||
By default, the Content-Security-Policy HTTL header '''frame-ancestors'' directive is set to '''self''', allowing the parent website where QPR ProcessAnalyzer is embedded to, to be located in the same origin. If the parent website is in another origin, the CSP needs to be changed as follows (allowing to embed QPR ProcessAnalyzer in the example.com website): | By default, the Content-Security-Policy HTTL header '''frame-ancestors''' directive is set to '''self''', allowing the parent website where QPR ProcessAnalyzer is embedded to, to be located in the same origin. If the parent website is in another origin, the CSP needs to be changed as follows (allowing to embed QPR ProcessAnalyzer in the example.com website): | ||
<pre> | <pre> | ||
frame-ancestors 'self' example.com; | frame-ancestors 'self' example.com; | ||
| Line 24: | Line 24: | ||
== Using SAML authentication with embedding == | == Using SAML authentication with embedding == | ||
When QPR ProcessAnalyzer is embedded | When QPR ProcessAnalyzer is embedded into another website with the [[SAML_2.0_Federated_Authentication|SAML authentication]] enabled, the authentication process is handled in a separate browser window or tab. This is necessary because some identity providers (IdP) do not permit authentication within an embedded frame (iframe element). Consequently, when SAML authentication begins, the identity provider's page will open in a new browser window. While this window is active, the embedded (original) window displays a message informing the user that authentication is in progress in a separate window. | ||
If the browser has popup blocking enabled, the new window cannot open. In such cases, a descriptive message prompts the user to disable popup blocking. Additionally, the user can manually open the authentication window by clicking the embedded frame, even if popups are blocked. Once the identity provider login is successful, the new window will close, and the original browser window will redirect to QPR ProcessAnalyzer. However, if the separate browser window is closed before completing the login, the original window will display the standard QPR ProcessAnalyzer login view. | |||
In addition, for SAML authentication to work correctly when the identity provider is located on a '''different origin''' than the QPR ProcessAnalyzer server itself, the <code>Cross-Origin-Opener-Policy</code> HTTP header must be changed from its default value of <code>"same-origin"</code> to <code>"unsafe-none"</code>. | |||
----'''Additional Information:''' | |||
* '''Cross-Origin-Opener-Policy (COOP) Header:''' This is a response header that provides a way for a document to control whether a new document opened in a top-level context (like a new tab or window) shares the same browsing context group as its opener. Setting it to <code>unsafe-none</code> allows the cross-origin authentication flow to complete successfully in this embedded scenario. For more technical details, see https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/Cross-Origin-Opener-Policy | |||
Latest revision as of 12:58, 11 November 2025
QPR ProcessAnalyzer can be embedded to another website, such as Microsoft Sharepoint. The embedding is based on the iframe html element. By default, QPR ProcessAnalyzer only allows to be embedded by a website in the same origin that is restricted by the Content-Security-Policy HTTL header. More information how to change the CSP setting in Security Hardening. Note also the special behavior when using the SAML authentication with embedding.
Example embedding webpage
This is a simple example page containing an iframe element that embeds QPR ProcessAnalyzer.
<!DOCTYPE html>
<html>
<body>
<iframe src="https://processanalyzer.company.com/qprpa/ui/#/dashboard?sys:dashboardIdentifier=/MyProject/MyDashboard" height="600" width="900"></iframe>
</body>
</html>
Change CSP frame-ancestors setting
By default, the Content-Security-Policy HTTL header frame-ancestors directive is set to self, allowing the parent website where QPR ProcessAnalyzer is embedded to, to be located in the same origin. If the parent website is in another origin, the CSP needs to be changed as follows (allowing to embed QPR ProcessAnalyzer in the example.com website):
frame-ancestors 'self' example.com;
If the CSP prevents the embedded website from showing, there will be a descriptive error message in the browser console. It contains details which CSP directive didn't allow to open the page.
More information about the Content-Security-Policy HTTL header: https://developer.mozilla.org/en-US/docs/Web/HTTP/Guides/CSP.
Using SAML authentication with embedding
When QPR ProcessAnalyzer is embedded into another website with the SAML authentication enabled, the authentication process is handled in a separate browser window or tab. This is necessary because some identity providers (IdP) do not permit authentication within an embedded frame (iframe element). Consequently, when SAML authentication begins, the identity provider's page will open in a new browser window. While this window is active, the embedded (original) window displays a message informing the user that authentication is in progress in a separate window.
If the browser has popup blocking enabled, the new window cannot open. In such cases, a descriptive message prompts the user to disable popup blocking. Additionally, the user can manually open the authentication window by clicking the embedded frame, even if popups are blocked. Once the identity provider login is successful, the new window will close, and the original browser window will redirect to QPR ProcessAnalyzer. However, if the separate browser window is closed before completing the login, the original window will display the standard QPR ProcessAnalyzer login view.
In addition, for SAML authentication to work correctly when the identity provider is located on a different origin than the QPR ProcessAnalyzer server itself, the Cross-Origin-Opener-Policy HTTP header must be changed from its default value of "same-origin" to "unsafe-none".
Additional Information:
- Cross-Origin-Opener-Policy (COOP) Header: This is a response header that provides a way for a document to control whether a new document opened in a top-level context (like a new tab or window) shares the same browsing context group as its opener. Setting it to
unsafe-noneallows the cross-origin authentication flow to complete successfully in this embedded scenario. For more technical details, see https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/Cross-Origin-Opener-Policy