Next-auth: Error: Invalid state returned from Google oAuth provider on production

[shrmaky]

Hello everyone,

My Next-Auth application works completely fine when am running this in local environment, the redirection from google, and session registration in MongoDb is working fine,

When am trying to run the same application with same google id & secret in production, it is throwing Error: Invalid state returned from oAuth provider

_Already SET the valid NEXTAUTH_URL, DATABASE_URL, GOOGLE_ID & GOOGLE_SECRET_

[next-auth][error][callback_oauth_error] Error: Invalid state returned from oAuth provider
    at /home/node/app/node_modules/next-auth/dist/server/lib/oauth/callback.js:46:27
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (/home/node/app/node_modules/next-auth/dist/server/lib/oauth/callback.js:26:103)
    at _next (/home/node/app/node_modules/next-auth/dist/server/lib/oauth/callback.js:28:194)
    at /home/node/app/node_modules/next-auth/dist/server/lib/oauth/callback.js:28:364
    at new Promise (<anonymous>)
    at /home/node/app/node_modules/next-auth/dist/server/lib/oauth/callback.js:28:97
    at /home/node/app/node_modules/next-auth/dist/server/lib/oauth/callback.js:143:17
    at /home/node/app/node_modules/next-auth/dist/server/routes/callback.js:58:31
    at Generator.next (<anonymous>)
https://next-auth.js.org/errors#callback_oauth_error

Feedback
Documentation refers to searching through online documentation, code comments and issue history. The example project refers to next-auth-example.

• [] Found the documentation helpful
• [X] Found documentation but was incomplete
• [ ] Could not find relevant documentation
• [ ] Found the example project helpful
• [ ] Did not find the example project helpful

[iaincollins]

Hmm we have seen folks run into this before.

1. You might want to double / triple check the callback URLs for production specified in the app in Google.
2. You might want to check the Client ID and Client Secret set in production.

I think at least one of these can cause that problem.

We really need to create a ticket to capture improving the debugging here before I forget about it again - if we logged the response at this point it would probably be saying what was wrong in the console.

[glenames]

Im seeing the same issue - but only on first login of a session. Try immediately again and all is fine.

The error returns after logging in again after about an hour 24 hours, which i think is a new token.

[JNussens]

Having the same issue here, but using Facebook provider. Any luck solving this yet?

[JNussens]

Having the same issue here, but using Facebook provider. Any luck solving this yet?

Just found out that the problem was with a firebase import. Basically, it just requires firebase-admin, initializes using serviceAccount and exports admin.firestore()

I'm still trying to understand why this error is happening when using firebase-admin...

[JNussens]

@shrmaky Double-check your [...nextauth] file, make sure none of the defined callback methods have errors. Try commenting the callbacks part, just to check if that works.

[JNussens]

@shrmaky Double-check your [...nextauth] file, make sure none of the defined callback methods have errors. Try commenting the callbacks part, just to check if that works.

If you're using the serverless build target, try changing that to server, it did the trick in my case.

[shrmaky]

Thanks @JNussens i will try.

[Ramos-Diego]

@iaincollins

Hmm we have seen folks run into this before.

1. You might want to double / triple check the callback URLs for production specified in the app in Google.
2. You might want to check the Client ID and Client Secret set in production.

I think at least one of these can cause that problem.

We really need to create a ticket to capture improving the debugging here before I forget about it again - if we logged the response at this point it would probably be saying what was wrong in the console.

Hey I'm having this same issue.

I am convinced that the latest version of iOS or Safari for iOS broke authentication with Google. I've tested this an ungodly amount of times. I ONLY get this error when I try to login from an iPhone. I tested Android, Windows and Chrome in MacOS. It's all good. I'm absolutely positively sure that my code and callback URL's, Client ID and Secret are correct. Otherwise, I would not be able to login from any other device.

Here's my next-auth config.

[GET] /api/auth/callback/google?state=770d5...
12:41:07:32
Status: 302
Duration: 3.47ms
Memory Used: 126 MB
ID: gscxw-1607449...
User Agent:
Mozilla/5.0 (iPhone; CPU iPhone OS 14_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0.1 Mobile/15E148 Safari/604.1
2020-12-08T17:41:07.367Z    20132d29-5534-4302-a619-da1d3...    ERROR   [next-auth][error][callback_oauth_error] Error: Invalid state returned from oAuth provider
    at /var/task/node_modules/next-auth/dist/server/lib/oauth/callback.js:46:27
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (/var/task/node_modules/next-auth/dist/server/lib/oauth/callback.js:26:103)
    at _next (/var/task/node_modules/next-auth/dist/server/lib/oauth/callback.js:28:194)
    at /var/task/node_modules/next-auth/dist/server/lib/oauth/callback.js:28:364
    at new Promise (<anonymous>)
    at /var/task/node_modules/next-auth/dist/server/lib/oauth/callback.js:28:97
    at /var/task/node_modules/next-auth/dist/server/lib/oauth/callback.js:143:17
    at /var/task/node_modules/next-auth/dist/server/routes/callback.js:58:31
    at Generator.next (<anonymous>) 
https://next-auth.js.org/errors#callback_oauth_error

[anerror404]

i am facing the same problem. It happens randomly, most of the time everything works just fine and sometime it's not. I am using the same config.

[Ramos-Diego]

@anerror404 Are you using PWA with your app? I think that's what causing the issue. See here.

[anerror404]

@anerror404 Are you using PWA with your app? I think that's what causing the issue. See here.

i am not using PWA. It works perfectly 95% of time i guess. Suddenly stop working when user try to login with facebook or google. Even sometime it works in one device and doesn't in another device at the same time. Sometimes i get this error when user click on the social login icon, sometimes when user clicks on the social login icon, choose the user account.

It's causing me serious problem as i m running an e-commerce site. People can't order without login.

[Ramos-Diego]

@anerror404 in #952 @martinatwainobicom provided a solution.

// [...nextauth].js
Providers.Google({
  clientId: process.env.NEXTAUTH_GOOGLE_ID,
  clientSecret: process.env.NEXTAUTH_GOOGLE_SECRET,
  state: false, // Disable the state feature
}),

It worked for me, but apparently, this opens a CSRF attacks vulnerability. I cannot advice you to use it because I don't know the implications of this solution.

This is what the documentation says about the state:

GET /api/auth/callback/:provider
Handles returning requests from OAuth services during sign in.
For OAuth 2.0 providers that support the state option, the value of the state parameter is checked against the one that was generated when the sign in flow was started - this uses a hash of the CSRF token which MUST match for both the POST and GET calls during sign in.