소셜 로그인

OAuth를 통해 로그인한 경우, 다른 페이지에서 인증을 처리하기 때문에 사용자의 id, password를 서버에 전달 할 필요가 없다.
현재 진행중인 프로젝트에서는 소셜로그인만 사용하므로 User 모델을 다음과 같이 작성했다.

prisma/schema.prisma

enum Provider {
  KAKAO
}
model User {
  id    String  @id @default(auto()) @map("_id") @db.ObjectId
  provider Provider // 소셜로그인 종류
  username String? @unique
  blogname String?
  email String? @unique
  profileImage String? @unique
  createdAt DateTime @default(now())
}

소셜 로그인 시 닉네임, 이메일, 프로필 사진을 필수로 받기 때문에 각 항목을 필수로 만들었다.

src/pages/api/auth/[...nextauth].ts

export const authOptions: AuthOptions = {
  providers: [
    KakaoProvider({
      clientId: process.env.KAKAO_CLIENT_ID!,
      clientSecret: process.env.KAKAO_CLIENT_SECRET!,
    }),
  ],
  callbacks: {
    async jwt({ token, account }) {
      // 카카오를 이용한 소셜 로그인
      if (account?.provider === 'kakao') {
        const existingUser = await prisma.user.findFirst({
          where: {
            provider: 'KAKAO',
            username: token.name!,
            email: token.email!,
          },
        });
        // 등록된 유저가 아니라면 회원가입
        if (!existingUser) {
          await prisma.user.create({
            data: {
              provider: 'KAKAO',
              username: token.name!,
              email: token.email!,
              profileImage: token.picture,
            },
          });
        }
      }
      return token;
    },
    // 세션에 로그인한 유저의 데이터 입력
    async session({ session }) {
      const existingUser = await prisma.user.findFirst({
        where: { email: session.user.email },
        select: {
          id: true,
          username: true,
          email: true,
          profileImage: true,
          provider: true,
        },
      });
      session.user = existingUser!;
      return session;
    },
  },
};
export default NextAuth(authOptions);

추후에 Naver와 Google을 통한 소셜로그인도 구현할 예정입니다.