search

bhubr / react-simple-oauth2-login

Simple React component for OAuth2 login - Supports Authorization Code and Implicit Grant flows.
MIT License
49 stars 31 forks source link

How to handle browsers that don't support popup read / postMessage #33

Open tennox opened 3 years ago

tennox commented 3 years ago

As mentioned in https://github.com/bhubr/react-simple-oauth2-login/pull/20#issuecomment-862316655

During testing I encountered some browsers which apparently lack all or some of the following:

Examples of this:

Firefox Focus/Klar does not allow communication between tabs (at least I didn't get it to work)

MetaMask android (and many apps with in-app browser) (opens popup in separate browser app and thus allows no communication)

So I'm trying to figure out how to support those cases / provide a fallback.

Possible strategies:

Call server function in popup

Popup calls server & closes itself -> original window checks server for completion This would work in any situation, even when the popup is opening a separate

Disadvantage: added complexity in backend is needed

Fallback to redirect flow

A redirect flow would work in all browsers as it stays in same window and just redirects back to the app.

Disadvantage: Needs app to know how to restore app state.
Problem: I don't see a way to detect whether to use this fallback reliably, and defaulting to it degrades UX for all other users.

bhubr commented 3 years ago

Thanks for pointing this out again, and providing more context and details!

Since I've just starting working on the project again after a long hiatus, I'll try to use the momentum to keep on improving it... I'll look into it next Monday (too much eye strain for now 😧).