Auth Modal with iframe doesn't work on mobile web

[antonio]

Background
A core part of our app is an embeddable javascript widget that we allow our customers to embed into their website. This javascript widget is supposed to be very light weight and not have package dependencies. This javascript widget has a button that opens an iframe which renders the auth form we create and maintain separately.

Problem
When tapping on a social login from the iframe (google for example), the uxMode “popup” is blocked.

I’ve read other threads that suggest to use uxMode “redirect” instead but this also fails because our authentication logic is built inside an iframe.

When triggering the web3auth.authenticateUser(); method within an iframe with uxMode set to “redirect”, the SDK attempts to redirect within the iframe itself. This leads to an issue with certain OAuth providers, like Google, which deny being loaded inside an iframe, causing an error:

Refused to display 'https://accounts.google.com/' in a frame because it set 'X-Frame-Options' to 'deny'.

Suggestion:
For situations where the SDK is running within an iframe and uxMode is set to “redirect”, it would be extremely beneficial if the SDK could detect this scenario and automatically redirect at the parent window level. This should provide a smoother user experience while still maintaining the security and integrity of the authentication process.

Conclusion
This is quite a big blocker for us as we went live with a customer and all mobile users are unable to authenticate with social logins.

[chai]

Browser security model prevents iframe from making top-level redirects.
you need to architect your app so that things happen at top-level. there’s no work-around/way to prevent this.

[antonio]

Hey Chai,

Thank you for the response here. Like I mentioned above, the widget (top level) has limitations with the packages it can install and the only way we can think of getting the private keys, signatures and necessary info from web3auth is to create an iframe auth flow.

It would be helpful if you could also provide some insight on perhaps possible work arounds instead of just marking this as impossible.