Replies: 1 comment
-
This would be a welcome feature and is more consistent with the login/acquireToken popup methods |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
The MSAL.js team has been writing design proposals for new features and enhancements like the one below for quite some time, however, up until now they have only been distributed and discussed internally. We are posting this design proposal in an effort to be more transparent in some of the design decisions we make as well as to offer the open source community an opportunity to provide feedback before new features are released. We hope that this will be the start of more public design and collaboration with our customers going forward.
While feedback on the details of this design is the primary goal, we also welcome feedback on the format of the proposal and whether or not this is valuable. Let us know what you think!
Problem description
We've heard feedback that developers would like an alternative to the current logout API in
msal-browser
,msal-angular
andmsal-react
. Currently when callinglogout
msal will first clear all cached tokens and user data for either a specific user or all users then initiate a full-frame redirect to the AAD sign-out page where the user is asked to select an account to sign out of the AAD server. This is particularly problematic when an application is rendered in an iframe because iframes are blocked from redirecting to the AAD sign-out page. This proposal will cover the design considerations for alogoutPopup
API which would handle the AAD server sign-out step in a popup instead of redirecting away from the app.Constraints
postLogoutRedirectUri
to thelogout
/logoutPopup
API orPublicClientApplication
config in MSAL.jsredirectUri
in the Azure App PortallogoutPopup
.API Surface
API surface will be similar to the existing
logout
API documented hereBecause
logoutPopup
will not initiate a redirect developers will need to await the promise.In this scenario the
postLogoutRedirectUri
is only used in the popup window. If the developer wants to redirect the top frame of their app to a different page, such as the home page, after completing the logout they can do this in one of 3 ways:redirectMainWindowTo
optional property on the logout request:logoutPopup
:LOGOUT_SUCCESS
event:Note: Both logout API's primary function is to clear the local application cache of the user account and tokens. Asking the user to sign out of their account on the server via the popup is considered a convenience feature. It is done with "best effort" and will not throw errors if unsuccessful. The resolution of the promise and
LOGOUT_SUCCESS
/LOGOUT_FAILURE
events are based solely on the clearing of local data.To maintain consistency with the login APIs we will also add a
logoutRedirect
API which will do exactly whatlogout
does today. The existinglogout
API will be deprecated then removed in the next major version update (version 3.x).Pull Request containing the implementation and example usage of the proposed API can be found here
New EventType
As part of these changes we will also introduce a new
EventType
calledPOPUP_OPENED
which will be emited when a popup is opened.The payload will contain the window reference to the popup which developers can use to implement any custom logic related to the popup, such as resizing, refocusing or closing.
Proposed happy case path
logoutPopup
interaction_in_progress
flag to block other interactions such aslogin
APIsPOPUP_OPENED
eventpostLogoutRedirectUri
interaction_in_progress
flaglogoutPopup
promise resolves and emitsLOGOUT_SUCCESS
eventOther Scenarios
User closes popup before selecting account
logoutPopup
interaction_in_progress
flag to block other interactions such aslogin
APIsPOPUP_OPENED
eventinteraction_in_progress
flaglogoutPopup
promise resolves and emitsLOGOUT_SUCCESS
eventNote: User's session on AAD would remain active
Application is incorrectly configured for post logout redirect
logoutPopup
interaction_in_progress
flag to block other interactions such aslogin
APIsPOPUP_OPENED
eventinteraction_in_progress
flaglogoutPopup
promise resolves and emitsLOGOUT_SUCCESS
eventUser closes top frame browser/tab before selecting account
logoutPopup
interaction_in_progress
flag to block other interactions such aslogin
APIsPOPUP_OPENED
eventinteraction_in_progress
flaglogoutPopup
promise resolves and emitsLOGOUT_SUCCESS
eventNote: User's session on AAD would remain active
Popups are blocked
logoutPopup
interaction_in_progress
flag to block other interactions such aslogin
APIspopup_window_error
interaction_in_progress
flaglogoutPopup
promise rejects and emitsLOGOUT_FAILURE
eventNote: User's session on AAD would remain active
Design decisions
Pros/Cons for some of the decisions made above
When should msal clear application cache (tokens and accountInfo)?
Option 1: Before opening the popup
Pros:
logout
API works todayCons:
logoutPopup
promise resolves.Option 2: After the popup closes
Pros:
Cons:
logout
/logoutRedirect
API which clears cache before redirectingDecision
Option 1 was chosen for consistency with the existing APIs and to guarantee that the user is at least signed out locally.
What should happen when a user closes a popup?
Option 1: Resolve the promise - logout is successful
Pros:
logout
/logoutRedirect
which will raise theLOGOUT_SUCCESS
event after clearing local cache and before redirecting to the server.post_logout_redirect
configuration will force user to manually close popup. This is still a successful local and server logout.Cons:
loginPopup
Option 2: Throw user_cancelled_error
Pros:
loginPopup
Cons:
logout
/logoutRedirect
which does not care if server logout was successful or notpost_logout_redirect
configuration will force user to manually close popup. This is still a successful local and server logout.Decision
Option 1 was chosen to be consistent with existing
logout
API and to ensure false errors are not thrown in cases where a user must manually close the popup.Proof-of-Concept PR
If you'd like to try out
logoutPopup
for yourself, it has been implemented in this PR with the design decisions outlined above. If there are any features missing or if something doesn't quite work the way you would expect, feel free to leave a comment here or on that PR.Beta Was this translation helpful? Give feedback.
All reactions