Invalid_client Error when calling /token endpoint with Okta Sign-In Widget

Hi, I have created an SPA type Application on Okta with the Grant Type as “Authorization Code”. When I try to use this application with the Okta Sign in Widget in React[Username/Password + Duo Push MFA], and when I finish the sign in flow, the call to the /token endpoint returns:

    "error_description":"Client authentication failed. Either the client or the client credentials are invalid."

The Payload of the request is:

  1. client_id: {My SPA App client Id}
  2. redirect_uri: {https://{domain}.com/login/callback
  3. grant_type:authorization_code
  4. code_verifier:9892f9cb78ddc1d27…862309eb4718ebba
  5. code:n7eBhBsx7u741egu0…0WtkQstjU5Irjq8

Below is my Okta Config:

export const config: OktaConfig = {
    oidc: {
      issuer: 'https://{domain}',
      clientId: '{my SPA client id}',
      scopes: ['openid', 'profile'],
      redirectUri: `https://{domain}.com/login/callback`
    widget: {
      issuer: 'https://{domain}',
      clientId: '{my SPA client id}',
      scopes: ['openid', 'profile'],
      redirectUri: `https://{domain}.com/login/callback`

Could anyone help me figure out what the issue might be?

According to Cors encountered using Okta Signin Widget - #3 by andrea, the account I have is using Okta Classic Org and Not Okta Identity Engine. And I’ll attach a screenshot of my APP Config below

From the above it would seem that your application is passing the correct parameters to the /token endpoint, Reference.

I suggest opening a support case so we can ask for your Org URL, and client_id of the application to further research.

Hey @kryang a few things to check:

  1. Is the correct authorization server specified in your config? the default custom auth server has /oauth2/default in the URI. If you have a different custom auth server it would look something like like oauth2/ausb650sdf2Hv5RwKy468.
  2. Do you have an access policy configured which allows Authorization Code for that client app?
1 Like