From 62c69390f3b668a80b9ea1be8f0f66ea6bcc5ba2 Mon Sep 17 00:00:00 2001 From: Waldemar Mazurek Date: Tue, 5 Nov 2024 09:11:01 +0100 Subject: [PATCH] Adds document attribute for disable tcpcheck (#4008) --- client/src/lifecycleManager.js | 42 ++++++++++++++++++---------- docs/authorization-configuration.md | 12 ++++++++ docs/luigi-compound-container-api.md | 1 - 3 files changed, 40 insertions(+), 15 deletions(-) diff --git a/client/src/lifecycleManager.js b/client/src/lifecycleManager.js index 3abbe9720d..6efae4e0a2 100644 --- a/client/src/lifecycleManager.js +++ b/client/src/lifecycleManager.js @@ -9,11 +9,10 @@ class LifecycleManager extends LuigiClientBase { /** @private */ constructor() { super(); - this.disableTpcCheck = false; this.luigiInitialized = false; this.defaultContextKeys = ['context', 'internal', 'nodeParams', 'pathParams', 'searchParams']; this.setCurrentContext( - this.defaultContextKeys.reduce(function(acc, key) { + this.defaultContextKeys.reduce(function (acc, key) { acc[key] = {}; return acc; }, {}) @@ -38,6 +37,18 @@ class LifecycleManager extends LuigiClientBase { return window.document.head.hasAttribute('defer-luigi-init'); } + /** + * Check if the html head element contains the attribute "disable-tpc-check" + * @private + * @memberof Lifecycle + */ + _isTpcCheckDisabled() { + return ( + window.document.head.hasAttribute('disable-tpc-check') || + this.currentContext?.internal?.thirdPartyCookieCheck?.disabled + ); + } + /** * Check if LuigiClient is initialized * @returns {boolean} client initialized state @@ -66,7 +77,7 @@ class LifecycleManager extends LuigiClientBase { * Save context data every time navigation to a different node happens * @private */ - const setContext = rawData => { + const setContext = (rawData) => { for (let index = 0; index < this.defaultContextKeys.length; index++) { let key = this.defaultContextKeys[index]; try { @@ -80,13 +91,13 @@ class LifecycleManager extends LuigiClientBase { this.setCurrentContext(rawData); }; - const setAuthData = eventPayload => { + const setAuthData = (eventPayload) => { if (eventPayload) { this.authData = eventPayload; } }; - helpers.addEventListener('luigi.init', e => { + helpers.addEventListener('luigi.init', (e) => { setContext(e.data); setAuthData(e.data.authData); helpers.setLuigiCoreDomain(e.origin); @@ -96,15 +107,15 @@ class LifecycleManager extends LuigiClientBase { helpers.sendPostMessageToLuigiCore({ msg: 'luigi.init.ok' }); }); - helpers.addEventListener('luigi-client.inactive-microfrontend', e => { + helpers.addEventListener('luigi-client.inactive-microfrontend', (e) => { this._notifyInactive(e.origin); }); - helpers.addEventListener('luigi.auth.tokenIssued', e => { + helpers.addEventListener('luigi.auth.tokenIssued', (e) => { setAuthData(e.data.authData); }); - helpers.addEventListener('luigi.navigate', e => { + helpers.addEventListener('luigi.navigate', (e) => { setContext(e.data); if (!this.currentContext.internal.isNavigateBack && !this.currentContext.withoutSync) { const previousHash = window.location.hash; @@ -140,17 +151,18 @@ class LifecycleManager extends LuigiClientBase { } _tpcCheck() { - if (this.currentContext?.internal?.thirdPartyCookieCheck?.disabled || this.disableTpcCheck) { + if (this._isTpcCheckDisabled()) { return; } + let tpc = 'enabled'; let cookies = document.cookie; let luigiCookie; if (cookies) { luigiCookie = cookies .split(';') - .map(cookie => cookie.trim()) - .find(cookie => cookie === 'luigiCookie=true'); + .map((cookie) => cookie.trim()) + .find((cookie) => cookie === 'luigiCookie=true'); } if (luigiCookie === 'luigiCookie=true') { document.cookie = 'luigiCookie=; Max-Age=-99999999; SameSite=None; Secure'; @@ -160,8 +172,8 @@ class LifecycleManager extends LuigiClientBase { if (cookies) { luigiCookie = cookies .split(';') - .map(cookie => cookie.trim()) - .find(cookie => cookie === 'luigiCookie=true'); + .map((cookie) => cookie.trim()) + .find((cookie) => cookie === 'luigiCookie=true'); } if (luigiCookie === 'luigiCookie=true') { document.cookie = 'luigiCookie=; Max-Age=-99999999; SameSite=None; Secure'; @@ -231,9 +243,11 @@ class LifecycleManager extends LuigiClientBase { * const initListenerId = LuigiClient.addInitListener((context) => storeContextToMF(context)) */ addInitListener(initFn, disableTpcCheck) { - this.disableTpcCheck = disableTpcCheck; const id = helpers.getRandomId(); this._onInitFns[id] = initFn; + if (disableTpcCheck) { + document.head.setAttribute('disable-tpc-check'); + } if (this.luigiInitialized && helpers.isFunction(initFn)) { initFn(this.currentContext.context, helpers.getLuigiCoreDomain()); } diff --git a/docs/authorization-configuration.md b/docs/authorization-configuration.md index 44e1294b17..a15e4834cb 100644 --- a/docs/authorization-configuration.md +++ b/docs/authorization-configuration.md @@ -157,6 +157,18 @@ When Luigi fails to renew the token and then logs the user out, it adds the `?re Use these parameters to set a logout page. + +>**TIP:** There's an option to disable third party cookie check declaratively - in your micro frontend HTML that serves as entry file, you must add the `disable-tpc-check` attribute into the `` element as follows: + +```html + + + .... + + ..... + +``` + ## OAuth2 Implicit Grant configuration This code snippet demonstrates how to configure authorization using OAuth2 Implicit Grant in Luigi. Note that you must install the [OAuth2 Plugin](auth-oauth2.md) first. diff --git a/docs/luigi-compound-container-api.md b/docs/luigi-compound-container-api.md index 22057f0998..f68aa56b63 100644 --- a/docs/luigi-compound-container-api.md +++ b/docs/luigi-compound-container-api.md @@ -19,7 +19,6 @@ meta --> This document outlines the parameters provided by the Luigi Compound Container. Luigi Compound Container provides the possibility to insert multiple webcomponent-based microfrontends in one container.
In addition you can use standard `addEventListener` function to react on events emmitted by the Luigi Compound Container. The list of events and their meaning can be found [here](https://github.com/SAP/luigi/blob/main/container/src/constants/communication.ts). - ## API Reference