How should handle users logout use case when multiple browser tabs are opened

Question

I am using angular-oauth2-oidc with Identity Server 4.

Users need to Login via OpenId Connect Implicit Flow. My Id and Access token are stored in the web browser localStorage.

When user opens multiple browser tabs and then user logs out from one of the tabs, how should I handle rest of the tabs?

I have tried to catch session_terminated events , and they try to log the user out. However, it does not redirect the user back to the login page.

this.oauthService.events.filter(e => e.type ==='session_terminated')
                  .subscribe(e => {this.oauthService.logout();})

any suggestions? thanks

Answer 1

Interesting. It was on my to do list to see how this works with the library anyways.

I had already created a dedicated playground example repo that was perfect for testing this. What I found was that there are two distinct scenarios:

1. The user goes to the IdentityServer themselves, and click log out
2. The user does a Single Sign Out via our own app

Only in the first scenario do you get a session_terminated event. In the second scenario (which you seem to have) you get a session_error event in the second tab because the first tab:

1. Clears your stored tokens
2. Redirects you to the log out page (where you still have to click log out)

You can see as much in these screencaptures:

Scenario 1: log out explicitly in a third tab

Scenario 2: log out from the app

So I think your solution is to also hook into session_error, or something similar.

---

Footnote: thinking some more about the above, I reckon that other workarounds might also be possible by listening to localStorage events, and notice when the access_token is being cleared by another tab.