I implemented Google OAuth login using next-auth. In the async signIn function, I query the database with the getUser function, and if it is the first time the user logs in, I redirect them to the /sign-up page. However, on the /sign-up page, I found that the session was null. I considered using an adapter, but it would create many tables in the database. I want to minimize the values stored in the database.
// auth.ts
export const { handlers, auth } = NextAuth({
providers: [
GoogleProvider({
clientId: process.env.GOOGLE_CLIENT_ID as string,
clientSecret: process.env.GOOGLE_CLIENT_SECRET as string,
}),
],
callbacks: {
async signIn({ user, account, profile }) {
if (account?.provider === "google") {
const isNewUSer = await getUser({ uuid: profile.sub });
if (!isNewUSer) {
return true;
}
}
return "/sign-up";
},
async jwt({ token, account, profile }) {
if (account && profile) {
token.sub = profile.sub;
token.name = profile.name;
token.email = profile.email;
token.isNewUser = false;
}
return token;
},
async session({ session, token }) {
if (session.user) {
session.user.id = token.sub;
session.user.isNewUser = token.isNewUser as boolean;
}
return session;
},
},
pages: {
signIn: "/login",
newUser: "/sign-up",
},
});
// /sign-up/page.tsx
import { auth } from "@/auth";
export default async function SignUp() {
const session = await auth();
console.log("sign-up session = ", session); // looged with google, but session is null
return (
<div>
<form>
{/* "The action stores user information such as nickname, uuid, and email in the database. */}
<input type="text" placeholder="Enter your Nickname" name="nickname" />
<button>Submit</button>
</form>
</div>
);
}
How can I redirect a new user to the /sign-up page while passing the user information received from Google?
next-router:app-router
next:14.2.16
next-auth:5.0.0 (beta)