We need to build an identity provider to authenticate users in an OKTA account (say account 1) to use an application which is registered in another OKTA account (say account 2). I followed this guide - Add an external Identity Provider | Okta Developer to create the said identity provider. However the app I have is a react SPA, where the client authentication uses a PKCE instead of client secret.
How do I tackle this? Is there any way to avoid using the client secret in the steps mentioned in the guide above?
We only support authorization code flow for external identity providers.
However, as you are setting up an Okta-to-Okta connection, all you should have to do is create a Web app in the Org that you are using as the Identity Provider (the Source org, as that is where the user was created and has credentials). These values will then be used when you create the IdP in the Target org (the org that these users need to log into)
Your actual app that the users in this Source/IdP org will use will actually be created in the second (Target) Okta org (the one in which you configure/create the Identity Provider), and that one can be a SPA. Your React app would then use the client ID for the SPA app in your Target org and users from both the Source org AND the Target org will be able to login
1 Like
hi @andrea, thanks for your answer. Here are the steps I followed
- Created a web application in my Source OKTA account and obtained the client id and client secret from the same. I assigned a user to this app (say user1) and this user needs to login into the app created in my Target OKTA org
- In my target OKTA org, I created a Single-Page Application integration (react) with the OIDC sign-in method. Apart from this I created an OpenId Connect IdP and configured it with the client id and client secret obtained in the above step.
However, I’m unable to sign in to my react SPA with user1 (step1), which fails at the authorization step. I’m assuming that as user1 is assigned to the web app, and the IdP created in the second step is configured using the client details from this web app, user1 should be able to login to my react app. Is my assumption correct? Am I missing any step? Kindly help me here
Are you seeing an error when trying to log the user in? Is it breaking when you try to log the user into their source Okta org, or when they are sent to the target org?
You might want to step back through our set-up guide to be sure you got all the pieces configured correctly: Add an external Identity Provider | Okta Developer
Yes, I am getting an error when I try to log the user from the source org in the target org - which fails with the incorrect password error, even though the credentials are correct.
I’ve checked the guide, seems like I’ve done everything as mentioned there. Can you let me know if the steps and the assumptions I mentioned in my previous reply are correct?
Your steps looked right to me. When the user hits the target org, are they getting routed back to their source org via a routing rule (aka, are they navigating to the target org/app directly) or are you sending them there via an /authorize request for the SPA in the target org, passing along the idp in the request parameters (as in the HTML Link example in our docs)?
I’m facing a 400 bad request error while trying to test the /authorize endpoint using the IdP configured in the target org as mentioned in Add an external Identity Provider | Okta Developer. The client_id param I’m using in the URL is the client_id of the web app that is present in the source org (and that contains the ‘outside’ user). I’m not sure what’s causing the bad request error and the same error translates when I set a routing rule for the IdP to use this custom IdP for the SPA app in the target org.
I’m running the SPA on localhost for now. Does my SPA need to run on a secure domain only for a user from the other okta org to login? Please let me know