400: Bad Request BAD REQUEST Your request resulted in an error


I was reading through your documentation here to try and implement authentication on my react app.

I wanted users to be authenticated for all routes so i did the following:

      <Security {...config}>
        <SecureRoute path="/" />

and my config object looks like this:

const config = {
  clientId: "{my_client_id}",
  issuer: "https://dev-531502.okta.com/oauth2/default",
  redirectUri: "http://localhost:3000/",
  scopes: ["openid", "profile", "email"],
  pkce: false,

the redirect URI matches up with what I have configured in the application but I keep getting a an error

400 Bad Request. Your request resulted in an error.

I have no idea what is causing it, can you help me? Thanks!

here is what the URL looks like from that error


@vijet can you help me out on this issue? thanks!

Hi @tinny10,

I’m not sure what the problem could be.
Try setting up this sample app in your environment - https://github.com/okta/samples-js-react/tree/master/okta-hosted-login
You can then modify it to fit your requirements probably.

Hi @tinny10

Can you please remove the curly brackets from the config object so that the URL would be something similar to


Please check that you have added also the redirect_uri http://localhost:3000/ under Admin >> Applications >> your OIDC application >> General tab >> Login Redirect URIs.