How to have Okta login and access to API behind Okta, in React app?

Questions
1

I got React app. Need to:

  1. login using Okta
  2. login (get access key) to third party API protected with Okta Auth2

Could be similar to this issue OpenID token based API access + custom login

How to do it? Can one have two nested < Security > tags?

2

Is there at least some idea how to do it?

3

Hi @nems

Do you want to have an authentication on secure routes with both tokens from Okta and third party API?

4

Hi @dragos

I have setup AWS API Gateway, with endpoints protected with authorizer (configured with issuer, audience and scopes) .
Using SPA on frontend, and Authorization code with PKCE flow.
SPA does /authorize, get code, sends code and code_challenge to /token, receives accessToken and idToken.

Now, when protected endpoint gets called with accessToken in Authorization Header, got this response:

status 401
www-authenticate: Bearer scope=“email openid profile” error=“invalid_token” error_description=“unable to find an appropriate key in the JWKS. Ensure a “kid” is provided in the JWT, and that your JWKS has a supported cert available for this ID”

and if I use idToken instead, response is:

status 403
www-authenticate: Bearer scope=“email openid profile” error=“insufficient_scope” error_description=“expected scopes within the token”

What is going on here?
How to have scopes in idToken?
Why accessToken does not work?

5

Hi @nems

Usually the error regarding the keys in access token is in regards to using Okta authorization server instead of a custom authorization server. Due to RFC restrictions, only custom authorization servers can be used for local verification for access tokens. You can read further details about the difference between the authorization servers here.

Can you please try with a custom authorization server (for example https://dev-123456.okta.com/oauth2/default if using a developer tenant) to see if it works? You can register a free developer tenant here.

6

Hi @dragos

Thank you. That solved the issue(s).

7

@nems @dragos
How did you solve it?
I have also created custom authorization server but this custom server only provides Issuer URI and Audience. I have to use Okta Org Auth server to do the sign-in. I can’t replace the Okta Org Auth Server with Custom Auth Server directly. Can you please suggest how can i proceed ?

8

If you have a custom server, you should be able to use that for login. Why are you having issues using it?Are you encountering an error? If so, how have you configured your application to point to this server?

9

Working now. Was having the issue in getting the userinfo. Was using the endpoint /oauth2/v1/userinfo . After changing to /oauth2/default/v1/userinfo, it worked.

Thanks for the support. :slight_smile:

1 Like