Log into React SPA and then SSO in ASP.NET Core app using OIDC

I have an ASP.NET Core Razor Pages web app that uses the Authorization Code flow and Okta sign-in widget. I’m in the process of migrating to a React SPA with okta-auth-js (with PKCE). The migration will take a few months, and I’d like to allow users who log onto the React SPA to use some sort of SSO to log onto the ASP.NET Core app to access views that we haven’t migrated yet.

The ASP.NET Core app and React SPA use the same authorization server but different Okta Applications (client ids).

Can anyone give me some pointers on whether this is possible and, if so, how to get started?

@punchwalk Hi, you may need refer the doc of
https://developer.okta.com/code/react/okta_react_sign-in_widget/#config
For react, you need to take a look at this sdk.
https://developer.okta.com/code/javascript/okta_sign-in_widget/#using-with-okta-sdks
If you want the new project using the old app, try link it to the old app and use the old configuration such as client_id, redirect uri.

Thanks for the reply. Unless I am mistaken, the new project cannot use the old project’s Okta application, as we want to use PKCE in accordance with security best practices, and the old app wasn’t configured to use it.

@punchwalk Then you probably need to configure the new application and refer the doc of react sdk I sent you.

From the reading the linked article, it’s not clear how using the sign-in widget would solve this problem. Can you please elaborate?

@punchwalk Did you try this react sdk? Okta Sign-In Widget Guide | Okta Developer
What is your old application type?

I got our ASP.NET Core app working with the same Okta app as the React app (using OIDC with Code+PKCE).

We use the sign-in widget on the ASP.NET Core app. I logged into the React app, then clicked a link that app that points to a secured page on the ASP.NET Core app (going from React app to the ASP.NET Core app is the prevailing use case and therefore what we’ll need to support). The ASP.NET Core app did not detect my existing session with the React app and required me to login again. Both apps are on the same domain and I confirmed that they can be both see each other’s cookies. But I’m clearly missing something and am not sure what else to try.

@punchwalk - did you ever get this resolved? We’re trying to do something similar with the embedded sign-in widget (via OIDC) and another SAML-based app. Both use the same Okta instance but when we log in via the widget, then hit the SAML app directly, it doesn’t see our Okta session so the user is asked to authenticate again.
If we do this in the reverse order, it works fine.

You likely will want to add some logic to detect the existing Okta session and not render the widget if the user is already logged into Okta.

For example, you can use the session.exists() method to check if the app can see the Okta session cookie (set on the Okta domain). If there is one, you can call getWithoutPrompt to trigger an /authorize request in an iframe to get log the user in.

Of course, if your application is NOT on the same domain as your Okta org, you can run into 3rd party cookie issues. In which case, you can, if you suspect the user has a valid session, simply trigger the /authorize request and redirect the user back tot he Okta domain where the session cookie can be checked using getWithRedirect. As long as the cookie is still around/user’s Okta session is still valid, they won’t need to re-authenticate and will be sent straight back to the OIDC application.