Failed to verify code verifier

Problem statement

I am having issues with my Authorization code with PKCE flow, specifically, I am getting the “Failed to verify code verifier” error.

Symptoms

  • “Failed to verify code verifier” error

Cause

  • Calling the /authorize endpoint more than once (for example: forcing login more than once)

Solution

tl;dr: We recommend checking your application to make sure it does not make more than one login request.

Explanation:
When you make a login request, it saves the code_verifier in a cookie and sends the code_challenge to the /authorize endpoint.

If you call a login request multiple times, it will keep saving a new code_verifier which will override the previous one. It will also keep sending the browser to a new /authorize URL. If this happens, there is no guarantee that the code_challenge parameter in the /authorize URL will match the code_verifier cookie you have saved.

In short, you will need to make sure that the app only calls the login method once to log in. To reiterate, calling the login request method multiple times in quick succession will be prone to errors like the Invalid code verifier error you have observed.

See below for clarity:

// This is OK
function login() {
  loginWithRedirect();
}
// This will be error prone
function login() {
  loginWithRedirect();
  loginWithRedirect();
  loginWithRedirect();
}