Getting 500: Internal Server Error after deploying Next.js project in Vercel. Might be related to Environment Variables

This is what I found about deploying to Vercel.

https://next-auth.js.org/deployment

make sure what you are doing is correct based on that link.

These are other post that I fount somewhat like this problem, mostly people saying you have to add "NEXTAUTH_SECRET" for it to run in production:

How to fix api/auth/error issue of next-auth in production?

https://github.com/nextauthjs/next-auth/issues/5268

But if you are implementing a Database adapter, that could be the problem.

In my case, I used Prisma and needed to add in the Prisma folder:

import { PrismaClient } from '@prisma/client';

let prisma: PrismaClient;

if (process.env.NODE_ENV === "production") {
  prisma = new PrismaClient();
} else {
  let globalWithPrisma = global as typeof globalThis & {
    prisma: PrismaClient;
  };
  if (!globalWithPrisma.prisma) {
    globalWithPrisma.prisma = new PrismaClient();
  }
  prisma = globalWithPrisma.prisma;
}

export default prisma;

and latter in the [...nextauth] file do:

import prisma from "../../../../../prisma/prisma";

//...

const handler = NextAuth({
  adapter: PrismaAdapter(prisma) as Adapter,
  //...
});

//...

I hope this helped.

Yes, have to set the Environment Variable , tried it with vercel but didnot supported or maybe missed something, but works fine with netlify, just deploy with the environment variable, from your project .env.local files, get the keys and values give also provide the NEXTAUTH_URL properly , then it should run

I don't know for other hosting platforms and tiers but when I deployed my app to Vercel free tier I had to add every Environment Variable to the hosting platform.

You need to go to Dashboard -> Your app -> Settings -> Environment Variables and there you need to add all of your variables. With same name and value that you used in .env.local.

Also, don't forget to use NEXT_PUBLIC_ in front of every Environment Variable name. So it should look like this eg. NEXT_PUBLIC_MONGODB_URI="somethingsomething". So this NEXT_PUBLIC_ before the name of Environment Variable makes it so your Environment Variable is exposed to the browser. You don't need to use NEXT_PUBLIC_ when working localy but when you want to deploy then you need to use it in order to expose the Environment Variable to the browser.

I hope this helps. It helped me.

Had faced same problem and find out solution after a long research

The Trick is you have to set environment variable to vercel or any host platform

how to set environment variable in vercel

how to set environment variable in heroku