Question regarding NEXTAUTH_URL upon deployment on Vercel.

[Darealtube]

The documentation is great at explaining how things should be coded and how they work, so I am grateful for that. I am only confused regarding the NEXTAUTH_URL environment variable that is required.

My Question

I have a NextJs app in which I use getSessions and useSessions everywhere alongside a GraphQL API endpoint. On Development and build, everything seems to work fine when trying to sign out and sign in but when I try to deploy it in Vercel, all of a sudden I can't click the Sign In button because it says errors along the lines of

[error][client_fetch_error] (if I stated a NEXTAUTH_URL besides from http://localhost:3000 )
and along with
GET https://japhil-project.vercel.app/api/auth/providers 500 ( Upon clicking the Sign in Button )
GET https://japhil-project.vercel.app/api/auth/session 500

When I enter a value for the NEXTAUTH_URL like an actual URL https://<project_name>.vercel.app for example (URL on deployment), it seems to throw the [error][client_fetch_error] error along with the providers error, but it clearly said in the documentation that

If you see CLIENT_FETCH_ERROR make sure you have configured the NEXTAUTH_URL environment variable.

and that

When deploying to production, set the NEXTAUTH_URL environment variable to the canonical URL of your site.

but isn't https://<project_name>.vercel.app supposed to be the canonical URL of the site?

I was able to do what I wanted (Signing in and Signing out) during development and on build, but it failed on deployment so I figured the problem should have something to do with the NEXTAUTH_URL variable. I am quite unclear as to what the NEXTAUTH_URL variable should be when deploying to Vercel, and there may be other issues regarding the two GET errors (those coming from getSession and getProviders being called inside getServerSideProps ) that I would also like to know if there is something wrong. I am grateful for any responses that I'd get from it, because I want to understand this error as much as I can. There is a question in StackOverflow that is a bit similar to the error I am having right now, but it has no answers yet.

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

[sastraxi]

Make sure you've checked this checkbox in your Vercel app settings. Your NEXTAUTH_URL seems correct. For example, my app has NEXTAUTH_URL=https://www.sendy.video as I'm using a custom domain, but it will work with the vercel subdomain as well.

[rutikwankhade]

Thank you! I had the same doubt and This helped

[sastraxi]

Actually @Darealtube, just looking deeper at your problem (the 500 errors) tells me it's probably not an environment variable issue. Have you tried going to the live logs of your vercel deployment and seeing what's causing the Internal Server Error you're experiencing? Are you using a database?

[balazsorban44]

#2347 might be useful. Would love if someone could add it to the docs!

[Darealtube]

Oh I'm sorry I wasn't able to post an answer here. This was resolved 3 months ago, what I did was basically update next-auth to 3.23.1 because there was an issue in the canary adapter that was an issue in next-auth back in the day. Here was the issue in which I participated in and solved my issue #2012. Turns out, it wasn't an environment variable problem that I thought it was. Sorry for not closing this issue. 😅