Search code examples
next.jsnetlifynext-authsanity

NextJS next-auth 500 Internal Server Error when trying to login (Netlify)

When trying to login with next-auth, I get 500 from /api/auth/providers and "Internal Server Error" as the only message on the screen. This works great locally, but not in production. I use Netlify to host the project.

How do I fix these server issues?

packages:

  • "dotenv": "^16.0.1",
  • "next": "^13.2.4",
  • "next-auth": "^4.20.1",
  • "next-auth-sanity": "^1.4.8",
  • "next-connect": "^1.0.0",
  • "next-pwa": "^5.5.2",
  • "next-sanity": "^4.1.5",
  • "react": "^18.2.0",

Engine:

  • "node": "18.x"

Network messages

Before trying to login, next-auth already recognizes that there's something wrong and suggests it's the NEXTAUTH_URL that's incorrect. This value is set as localhost:3000 in the local environment and https://my-domain.com in Netlify. The value is also set for all scopes. The same goes for the NEXTAUTH_SECRET value

Errors from next-auth

The login component looks like this and it fails in the try/catch. The adapter I'm using is Sanity CMS. Again, this works fine locally.

enter image description here

Lastly this is the `[...nextauth].js with the options.

enter image description here

Solution

  • So I noticed that I accidentally added a "/" at the end of the NEXTAUTH_URL which caused the issue. I removed it and now it works both locally and in production.

    tldr: NEXTAUTH_URL="https://example.com/" --> NEXTAUTH_URL="https://example.com"