I am trying to add next-auth to my app with an external express server
Unanswered
Russian Blue posted this in #help-forum
Russian BlueOP
I have a latest nextjs app and am trying to add next-auth to it, but the catch is I am using an external backend server that holds the auth logic.
5 Replies
Russian BlueOP
auth.ts:import NextAuth, { Session } from "next-auth";
import Credentials from "next-auth/providers/credentials";
import axios from "axios";
import { LoginSchema } from "./schemas";
import { authConfig } from "./auth.config";
import { JWT } from "next-auth/jwt";
export const {
handlers: { GET, POST },
signIn,
signOut,
auth,
} = NextAuth({
...authConfig,
providers: [
Credentials({
async authorize(credentials): Promise<any> {
console.log("Here authorize now", credentials);
const validatedFields = LoginSchema.safeParse(credentials);
if (validatedFields.success) {
const { email, password } = validatedFields.data;
const res = await axios.post("http://localhost:8000/auth/login", {
email: email,
password: password,
});
if (res.data && res.data.access_token && res.data.user) {
return res.data.user;
}
}
return null;
},
}),
],
callbacks: {
async signIn({ user }) {
if (!user || !user.id) {
return false;
}
return true;
},
async session({ session, token }) {
session.user = token;
return session;
},
async jwt({ token, user }) {
if (user) {
token.id = user.id;
token.email = user.email;
}
return token;
},
...authConfig.callbacks,
},
session: {
strategy: "jwt",
},
});
import Credentials from "next-auth/providers/credentials";
import axios from "axios";
import { LoginSchema } from "./schemas";
import { authConfig } from "./auth.config";
import { JWT } from "next-auth/jwt";
export const {
handlers: { GET, POST },
signIn,
signOut,
auth,
} = NextAuth({
...authConfig,
providers: [
Credentials({
async authorize(credentials): Promise<any> {
console.log("Here authorize now", credentials);
const validatedFields = LoginSchema.safeParse(credentials);
if (validatedFields.success) {
const { email, password } = validatedFields.data;
const res = await axios.post("http://localhost:8000/auth/login", {
email: email,
password: password,
});
if (res.data && res.data.access_token && res.data.user) {
return res.data.user;
}
}
return null;
},
}),
],
callbacks: {
async signIn({ user }) {
if (!user || !user.id) {
return false;
}
return true;
},
async session({ session, token }) {
session.user = token;
return session;
},
async jwt({ token, user }) {
if (user) {
token.id = user.id;
token.email = user.email;
}
return token;
},
...authConfig.callbacks,
},
session: {
strategy: "jwt",
},
});
Sun bear
I suggest you take a look at the package called [lucia auth](https://lucia-auth.com/getting-started/nextjs-app) if you are using credentials, since next auth (auth.js) intentionally tries to make this process harder to implement. Lucia auth docs are really good unlike auth.js.
I know it's a hassle to change the auth provider if you have already something built with next auth, but lucia auth is worth it.
Russian BlueOP
but im confused on where to add it, the abstraction is annoying since im using an express backend and these libraries tend to assume im on fullstack next, what do you think?
Sun bear
here is the express [example repo](https://github.com/lucia-auth/examples/tree/main/express/username-and-password)