Create the NextAuth API Route
Create pages/api/auth/[...nextauth].js. This catch-all route handles sign-in, sign-out, provider callbacks, CSRF, and session endpoints.
File: `pages/api/auth/[...nextauth].js`
import NextAuth from "next-auth";
import GoogleProvider from "next-auth/providers/google";
import CredentialsProvider from "next-auth/providers/credentials";
export const authOptions = {
providers: [
GoogleProvider({
clientId: process.env.GOOGLE_CLIENT_ID,
clientSecret: process.env.GOOGLE_CLIENT_SECRET,
}),
CredentialsProvider({
name: "Email and password",
credentials: {
email: { label: "Email", type: "email" },
password: { label: "Password", type: "password" },
},
async authorize(credentials) {
if (!credentials?.email || !credentials?.password) return null;
const response = await fetch(`${process.env.AUTH_API_URL}/auth/login`, {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ email: credentials.email, password: credentials.password }),
cache: "no-store",
});
if (!response.ok) return null;
const result = await response.json();
const user = result?.user;
if (!user?.id || !user?.email) return null;
return { id: String(user.id), name: user.name ?? null, email: user.email, image: user.image ?? null, role: user.role ?? "user" };
},
}),
],
session: { strategy: "jwt" },
};
export default NextAuth(authOptions);💡 This baseline assumes your backend responds with
{ user: { id, email, name, image, role } }. Adapt the endpoint and response parsing to your API. The backend must verify passwords securely.