How do you do a secondary verification with the ID token upon successful login?

[dallas]

What is the earliest point in which you could check for the ID token? I am using okta-react and the sign-in widget (though I’d be open to a more custom solution if it was necessary) and currently the user logs in and then the token is stored and the user has access. What I need to do is run a second verification where we check for the user in a specific database to make sure they are active as an employee. The API is already setup to parse the JWT token and find the user by the associated email, so I have an endpoint to do this check. However, I cannot find a good place to run this verification.

I’ve tried so many ways and I either run into errors or the verification doesn’t always run or something…I would love advice on where to put this secondary verification. Ideally the token/user verification would be ran immediately after the token is retrieved, but we need the token to identify the user so it has to be post-auth. Thank you for your help!

[dallas]

I almost thought I found the solution, and may be on the right track. By adding the following to the sign-in widget configuration, the onSuccess function does return an idToken.

this.widget = new OktaSignIn({
      baseUrl: process.env.ISSUER + '/oauth2/default',
      clientId: process.env.CLIENT_ID,
      redirectUri: window.location.origin + '/implicit/callback',
      logo: logo,
      authParams: {
        responseType: 'id_token'
      }
    })

However, the response object’s idToken that is returned by the sign-in widget’s onSuccess function doesn’t pass verification. When I add a baseUrl of http://localhost:8009, the idToken is available but the initial backend verification of the token (done with jwt-verifier) throws the error “Error while resolving signing key for kid”. However, when I add a baseUrl of http://localhost:8009/implicit/callback I get the errors “Unable to connect to the server. Please check your network connection”, “UNSUPPORTED_BROWSER_ERROR”, “There was an error sending the request - have you enabled CORS?”, etc. immediately (as in this is thrown by the widget, not by any verification I’m doing).

The main auth object passed to the Security component has an issuer of http://localhost:8009/implicit/callback, but the sign-in widget won’t allow that, so it may be the issue, the difference in the iss field for the token.

[dallas]

I was on the right track and I found a solution to my issue. I needed the authParams object to include all of the configuration options that I have in the auth object in my routes.jsx. Now the id_token is in the response to the onSuccess function (specifically res[0].idToken) that I’m passing into the Sign-In Widget, where I am running my secondary verification step.

class SignInWidget extends React.Component {
  constructor (props) {
    super(props)
    this.widget = new OktaSignIn({
      baseUrl: process.env.ISSUER,
      logo: logo,
      clientId: process.env.CLIENT_ID,
      redirectUri: window.location.origin + '/implicit/callback',
      authParams: {
        issuer: process.env.ISSUER + '/oauth2/default',
        client_id: process.env.CLIENT_ID,
        redirect_uri: window.location.origin + '/implicit/callback',
        responseType: ['id_token', 'token']
      }
    })
    this.state = {
      verified: false
    }
  }

  componentDidMount () {
    const el = ReactDOM.findDOMNode(this)
    this.widget.renderEl({ el }, this.props.onSuccess, this.props.onError)
  }

  componentWillUnmount () {
    this.widget.remove()
  }

  render () {
    return (
      <div className={css.container} />
    )
  }
}