Next Auth works on Localhost but not after deployment on vercel

[Swanand-Wagh]

I'm not getting any errors either on localhost or on prod. Weird things happen like, once I try to login in prod, my middleware is not able to get the token & role, hence the user keeps being redirected to login page cuz of middleware. This doesn't happen on localhost. Moreover even after this redirection, I'm able to print session using const session = await auth() in my components other than the middleware. ie. even on prod, session is being fetched outside of middleware but token & cookies get null/undefined.

AuthConfig: https://github.com/Swanand-Wagh/Entomon/blob/main/src/features/auth/server/next-auth-config.ts
`import 'server-only';

import { prisma } from '@/db/prisma';
import { userService } from '@/features/users/server/service';
import { ErrorResponse } from '@/types/errors';
import { PrismaAdapter } from '@auth/prisma-adapter';
import { UserRole } from '@prisma/client';
import NextAuth, { CredentialsSignin, DefaultSession, NextAuthConfig } from 'next-auth';
import Credentials from 'next-auth/providers/credentials';
import Google from 'next-auth/providers/google';
import { login2FASchema, loginWithCredsSchema } from '../schema/auth';
import { authService } from './service';

declare module 'next-auth' {
interface Session {
user: {
id: string;
name: string;
email: string;
role: UserRole;
} & DefaultSession['user'];
}
}

export type SessionUser = {
id: string;
name: string;
email: string;
image: string;
role: UserRole;
};

const providersConfig = {
providers: [
Google,
Credentials({
async authorize(credentials) {
try {
const creds = loginWithCredsSchema.safeParse(credentials);
if (creds.success) {
let user = await authService.loginWithCreds(creds.data);
if (user.isTwoFactorEnabled) {
return null;
}
return user;
} else {
const creds2fa = login2FASchema.safeParse(credentials);
if (creds2fa.success) {
return authService.login2FA(creds2fa.data);
}
}
return null;
} catch (e) {
if (e instanceof ErrorResponse) {
throw new CredentialsSignin(e.message);
}
throw new CredentialsSignin('Invalid credentials');
}
},
}),
],
} satisfies NextAuthConfig;

export const { handlers, signIn, signOut, auth } = NextAuth({
session: { strategy: 'jwt' },
callbacks: {
// Add Role to JWT
async jwt({ token }) {
if (!token.sub) return token;
const user = await userService.getUserById(token.sub);
token.role = user.role;
return token;
},

// Add Role to session
async session({ session, token }) {
  if (!session.user) return session;
  session.user.id = token.sub as string;
  session.user.role = token.role!! as UserRole;
  return session;
},

},
adapter: PrismaAdapter(prisma),
secret: process.env.AUTH_SECRET as string,
providers: providersConfig.providers,
});
`

AuthProviders: https://github.com/Swanand-Wagh/Entomon/blob/main/src/features/auth/server/next-auth-provider.ts
`import 'server-only';

import { ErrorResponse } from '@/types/errors';
import { CredentialsSignin, NextAuthConfig } from 'next-auth';
import Credentials from 'next-auth/providers/credentials';
import Google from 'next-auth/providers/google';
import { login2FASchema, loginWithCredsSchema } from '../schema/auth';
import { authService } from './service';

export default {
providers: [
Google,
Credentials({
async authorize(credentials) {
try {
const creds = loginWithCredsSchema.safeParse(credentials);
if (creds.success) {
let user = await authService.loginWithCreds(creds.data);
if (user.isTwoFactorEnabled) {
return null;
}
return user;
} else {
const creds2fa = login2FASchema.safeParse(credentials);
if (creds2fa.success) {
return authService.login2FA(creds2fa.data);
}
}
return null;
} catch (e) {
if (e instanceof ErrorResponse) {
throw new CredentialsSignin(e.message);
}
throw new CredentialsSignin('Invalid credentials');
}
},
}),
],
} satisfies NextAuthConfig;
`

Middleware: https://github.com/Swanand-Wagh/Entomon/blob/main/src/middleware.ts
`import { NextResponse, NextRequest } from 'next/server';

import {
AUTH_ROUTES,
ADMIN_ROUTES,
PUBLIC_ROUTES,
ROUTE_MAPPINGS,
API_AUTH_PREFIX,
DEFAULT_LOGIN_REDIRECT,
} from '@/lib/routes';
import { getToken } from 'next-auth/jwt';

type routeMapping = keyof typeof ROUTE_MAPPINGS;

export async function middleware(req: NextRequest) {
const token = await getToken({ req, secret: process.env.AUTH_SECRET });
const role = token?.role;
console.info('Role:', role);
console.info('Token:', token);
console.info('Logged in:', !!token);
const isLoggedIn = !!token;

console.log('Headers:', req.headers);
console.log('Cookies:', req.cookies);

const nextUrl = req.nextUrl;
const pathname = nextUrl.pathname as routeMapping;

// Handle route mappings
if (pathname in ROUTE_MAPPINGS) {
return NextResponse.redirect(new URL(ROUTE_MAPPINGS[pathname], nextUrl));
}

// Allow API auth routes
if (pathname.startsWith(API_AUTH_PREFIX)) {
return NextResponse.next();
}

// Prevent 'USER' role from accessing admin routes
if (role === 'USER' && ADMIN_ROUTES.test(pathname)) {
return NextResponse.redirect(new URL(DEFAULT_LOGIN_REDIRECT, nextUrl));
}

// Handle authentication routes
if (AUTH_ROUTES.includes(pathname)) {
return isLoggedIn ? NextResponse.redirect(new URL(DEFAULT_LOGIN_REDIRECT, nextUrl)) : NextResponse.next();
}

// Redirect unauthenticated users away from private routes
if (!isLoggedIn && !PUBLIC_ROUTES.test(pathname)) {
const callbackUrl = encodeURIComponent(${nextUrl.pathname}${nextUrl.search});
return NextResponse.redirect(new URL(/auth/login?callbackUrl=${callbackUrl}, nextUrl));
}

return NextResponse.next();
}

export const config = {
matcher: [
// Skip Next.js internals and all static files, unless found in search params
'/((?!_next|[^?]\.(?:html?|css|js(?!on)|jpe?g|webp|png|gif|svg|ttf|woff2?|ico|csv|docx?|xlsx?|zip|webmanifest)).)',
// Always run for API routes
'/(api|trpc)(.*)',
],
};
`

I have setup all env variables: AUTH_TRUST_HOST, AUTH_SECRET, AUTH_GOOGLE_SECRET, AUTH_GOOGLE_ID, NEXT_PUBLIC_APP_URL, DATABASE_URL

[Swanand-Wagh]

I Solved it. I'm able to get the token in the middleware now by doing the following:

const token = await getToken({ req, secret: process.env.AUTH_SECRET, secureCookie: true, cookieName: process.env.NODE_ENV !== 'production' ? 'authjs.session-token' : '__Secure-authjs.session-token', });