Angular Okta SDK receives 400 on POST /token

Hi I created a Google Identity Provider in my developer account. In addition I created an OIDC SPA application name “My Google Okta SPA” with grant type “Authorization Code” and routed with a custom route rule.

When I launch my “Angular” SPA, it routes user to Google’s login correctly. After Google login I’m routed back to my SPA app callback url “http://localhost:4200/login/callback”.

It appears my SPA is making a POST call to retrieve token; however I’m getting a 400 error. Did I configure something incorrectly? See my app detail below:

NOTE: I removed “/” from some urls to bypass 5 link forum restriction.

POST call gets a 400 error:

    "0": "",
    "1": {
        "method": "POST",
        "headers": {
            "Accept": "application/json",
            "Content-Type": "application/x-www-form-urlencoded",
            "X-Okta-User-Agent-Extended": "@okta/okta-angular/3.1.0 okta-auth-js/4.9.2"
        "body": "client_id=x9x9x9x9x9&redirect_uri=http%3A%2F%2Flocalhost%3A4200%2Flogin%2Fcallback&grant_type=authorization_code&code_verifier=ae0ea663035622866f4c1129caa02c194ad8af7351e&code=oU2Q0JZ4NYNrghyfhBoghM4-1rsin9gKQlkHj6oxsbM",
        "credentials": "omit"

App Details:

Google Identity Provider:
Name: Google Okta
Type: Google
IdP ID: 0oa1icqbt5FwXGcpN5d7
Authorize URL:{clientId}&response_type={responseType}&response_mode={responseMode}&scope={scopes}&redirect_uri={redirectUri}&state={state}&nonce={nonce}
Redirect URI:

My Developer Account: https:

Routing Rule: “Google Redirect”
Redirect when user is accessing “My Google Okta SPA”

Type: Angular application using @okta/okta-angular SDK
Name: My Google Okta SPA
redirect URIs: http: localhost:4200 login callback
Sign-out redirect URIs: http: localhost:4200

Okta Angular SDK configuration:

  oidc: {
    authorizeUrl: 'https: oauth2 v1 authorize',
    issuer: 'https: oauth2 aus1jl6tutVEuCKBi5d7',
    idp: `${environment.IDP}`,
    clientId: `${environment.CLIENT_ID}`,
    response_type: 'code',
    response_mode: 'fragment',
    redirectUri: 'login/callback',
    scopes: ['openid', 'profile', 'email'],
    pkce: true,
    testing: {
      disableHttpsCheck:  true,

You might want to remove some of your information like Okta org url and client_id.

I don’t think your token call is correct. Please take a look at the example from

1 Like

Thanks, I removed my Okta org info and client_id.
Note, Okta Angular SDK is constructing and generating the call per my oidc: { … }. config values.

Okta Angular SDK works fine logging in through Okta Hosted login pages but not using the Google login identify provider.

Angular SDK config for Okta Hosted Login pages:

  oidc_1: {
    clientId: `${environment.cCLIENT_ID}`,
    issuer: `${environment.cISSUER}`,
    redirectUri: `/${environment.OKTA_CALLBACK}`,
    scopes: ['openid', 'profile', 'email'],
    pkce: true,
    testing: {
      disableHttpsCheck: `${environment.OKTA_TESTING_DISABLEHTTPSCHECK}`