Okta Sign In widget Social Login

[Hekmil]

Hi,

I’m looking to implement Google Social Auth inside a Self-Hosted Sign-In widget and I’m looking at the 2 options :

• IdP Discovery
• Google Social login button (seems to work for now)

The widget will be hosted as a react app but I’m simply testing and finding pros & cons using a SPA application in Okta. For now I have an issue on both solution using SPA :

• For IdP Discovery, I’m getting redirect to Google (standard behavior here) to sign in but right after I’m getting a 404 error from Okta for url :

https://[Tenant-url]/login?fromLogin=true#

 this.widget = new OktaSignIn({
      baseUrl: this.props.baseUrl,
      display: 'popup',  
      features: {
          idpDiscovery: true
        },
          idpDiscovery: {
          requestContext: window.location.href
        }
    });

And If I get back to my widget the code to get the session doesn’t work :

widget.authClient.session.exists()
    .then(function (sessionExists) {
    console.log(sessionExists);
    if (sessionExists) {
      oktaAuth.authClient.token.getWithoutPrompt().then(function (response) {
        oktaAuth.authClient.tokenManager.setTokens(response.tokens);
      });
    }
  });

https://[Tenant-okta]/api/v1/sessions/me 404 (Not Found)

But it works in the browser (cookie issue?). I’m using a custom URL to avoid using 3rd party cookies.

[Cale]

Hello! First I’ll drop the disclaimer in here that Okta doesn’t officially support IDP discovery flows in the self-hosted widget due to various quirks. That being said, happy to try and help best I can.

Take a look at this article:

https://support.okta.com/help/s/article/IDP-Discovery-in-Custom-Widget-not-triggering-routing-rule-for-application?language=en_US

You will want to place the app embed link in your requestContext:

Having this configured, the App Embed link can be retrieved for the target application from the General tab, under the App Embed Link section, the Embed Link field information.

As for the other issue - are you seeing the 404 on /sessions/me in a localhost test environment or are your requests to Okta coming from a hosted application?

[Hekmil]

Yes I’ve seen that it is not officially supported.

I’m not trying to redirect to an app from Okta, but to some page of my application. Here in my dev environment my login page is http://localhost:3000/login and my secured page that needs auth is http://localhost:3000/protected

For your second question, it is from a localhost test environment indeed.

I would like to have the following flow :

1. Connect to app
2. Reach /protected but be redirected to /login with widget using IdP discovery
3. Sign in to Okta (MFA embedded or pop if possible?)
4. Redirection to /protected