인프런 커뮤니티 질문&답변

황정연님의 프로필 이미지

작성한 질문수

Next.js 필수 개발 가이드 3시간 완성!

Next.js - 크레덴셜 프로바이더 설정하기(Credentials Providers)

auth 에러에 대해서

해결된 질문

24.01.08 15:00 작성

·

408

1

제목: auth 해보고 있는데 오류가 나오고있네용

설명: 저는 prisma를 postgresql로 하고있습니다.

그래도 왜 이런 오류가 나오는지 원인은 잘 모르겠네요

 

내용: auth에서 credentials를 하고 있습니다.
import NextAuth from "next-auth";

import CredentialsProvider from "next-auth/providers/credentials";

import KakaoProvider from "next-auth/providers/kakao";

import NaverProvider from "next-auth/providers/naver";

import { PrismaAdapter } from "@auth/prisma-adapter";

import prisma from "@root/src/server/prisma";

import bcrypt from "bcrypt";

export const authOptions = {

providers: [

CredentialsProvider({

name: "Credentials",

credentials: {

accountId: { label: "Username", type: "text" },

password: { label: "Password", type: "password" },

email: { label: "Email", type: "email" },

name: { label: "Name", type: "text" },

},

async authorize(credentials, req) {

if (!credentials?.email || !credentials.password) {

return null;

}

const exUser = prisma.user.findUnique({

where: {

accountId: credentials.accountId as string,

email: credentials.email as string,

password: credentials.password,

name: credentials.name as string,

},

});

if (!exUser) return null;

const passwordMatch = await bcrypt.compare(

credentials.password as string,

exUser.password! // 오류 발생

);

return passwordMatch ? exUser : null;

},

}),

KakaoProvider({

clientId: process.env.KAKAO_CLIENT_ID!,

clientSecret: process.env.KAKAO_CLIENT_SECRET!,

}),

NaverProvider({

clientId: process.env.NAVER_CLIENT_ID!,

clientSecret: process.env.NAVER_CLIENT_SECRET!,

}),

],

adapter: PrismaAdapter(prisma),

};

const handler = NextAuth(authOptions); // authOptions 오류 발생

export { handler as GET, handler as POST };

 

이건 제 소스이고,
authOptions와 exUser.password! 부분에서 에러가 나오고 있는데 원인을 잘 모르겠습니다.

 

 

해당 오류입니다.

'Prisma__UserClient<{ id: string; accountId: string | null; name: string | null; email: string | null; emailVerified: Date | null; image: string | null; phone: string; password: string; role: ROLE; } | null, null, DefaultArgs>' 형식에 'password' 속성이 없습니다.ts(2339)

 

아래는 authOptions 오류입니다.

 '{ providers: (CredentialsConfig<Record<string, CredentialInput>> | OAuthConfig<KakaoProfile> | OAuthConfig<...>)[]; adapter: Adapter; }' 형식의 인수는 'NextAuthConfig' 형식의 매개 변수에 할당될 수 없습니다.
'adapter.linkAccount'의 형식은 해당 형식 간에 호환되지 않습니다.
'((account: import("/Users/hwangjeong-yeon/workspace/Project/FOCC/focc/node_modules/@auth/core/adapters").AdapterAccount) => Promise<void> | import("/Users/hwangjeong-yeon/workspace/Project/FOCC/focc/node_modules/@auth/core/types").Awaitable<import("/Users/hwangjeong-yeon/workspace/Project/FOCC/focc/node_modules/@aut...' 형식은 '((account: import("/Users/hwangjeong-yeon/workspace/Project/FOCC/focc/node_modules/next-auth/node_modules/@auth/core/adapters").AdapterAccount) => Promise<void> | import("/Users/hwangjeong-yeon/workspace/Project/FOCC/focc/node_modules/next-auth/node_modules/@auth/core/types").Awaitable<...>) | undefined' 형식에 할당할 수 없습니다.
'(account: import("/Users/hwangjeong-yeon/workspace/Project/FOCC/focc/node_modules/@auth/core/adapters").AdapterAccount) => Promise<void> | import("/Users/hwangjeong-yeon/workspace/Project/FOCC/focc/node_modules/@auth/core/types").Awaitable<import("/Users/hwangjeong-yeon/workspace/Project/FOCC/focc/node_modules/@auth...' 형식은 '(account: import("/Users/hwangjeong-yeon/workspace/Project/FOCC/focc/node_modules/next-auth/node_modules/@auth/core/adapters").AdapterAccount) => Promise<void> | import("/Users/hwangjeong-yeon/workspace/Project/FOCC/focc/node_modules/next-auth/node_modules/@auth/core/types").Awaitable<...>' 형식에 할당할 수 없습니다.
'Promise<void> | import("/Users/hwangjeong-yeon/workspace/Project/FOCC/focc/node_modules/@auth/core/types").Awaitable<import("/Users/hwangjeong-yeon/workspace/Project/FOCC/focc/node_modules/@auth/core/adapters").AdapterAccount | null | undefined>' 형식은 'Promise<void> | import("/Users/hwangjeong-yeon/workspace/Project/FOCC/focc/node_modules/next-auth/node_modules/@auth/core/types").Awaitable<import("/Users/hwangjeong-yeon/workspace/Project/FOCC/focc/node_modules/next-auth/node_modules/@auth/core/adapters").AdapterAccount | null | undefined>' 형식에 할당할 수 없습니다.
'AdapterAccount' 형식은 'Promise<void> | Awaitable<AdapterAccount | null | undefined>' 형식에 할당할 수 없습니다.
'AdapterAccount' 형식에 'Promise<void>' 형식의 then, catch, finally, [Symbol.toStringTag] 속성이 없습니다.ts(2345)

const authOptions: {
providers: (CredentialsConfig<Record<string, CredentialInput>> | OAuthConfig<KakaoProfile> | OAuthConfig<...>)[];
adapter: Adapter;
}

혹시 제가 schema 부분에서 오류가 있을까요?

 

model User {

id String @id @default(cuid())

accountId String?

name String?

email String? @unique

emailVerified DateTime?

image String?

phone String @default("")

password String @default("")

role ROLE @default(USER)

accounts Account[]

sessions Session[]

답변 2

1

Su님의 프로필 이미지
Su
지식공유자

2024. 01. 08. 16:41

안녕하세요 정연님 질문 주셔서 감사합니다! 실례지만 전체 소스코드가 있어야 확실하게 답변해 드릴 수 있을 것 같습니다.

우선 제출해주신 코드를 분석하자면 다음과 같습니다:
1. exUser.password! 오류:

- 오류 메시지에 따르면, 'Prisma__UserClient<...>' 형식에 'password' 속성이 없습니다.라고 나타나고 있습니다. 이는 prisma.user.findUnique({...}) 호출이 반환하는 객체에 password 속성이 없다는 것을 의미합니다.

- Prisma의 findUnique 메소드는 기본적으로 모든 필드를 가져오지 않습니다. 특정 필드를 명시적으로 선택해야 합니다. selectinclude 옵션을 사용하여 password 필드를 가져오도록 수정해야 합니다.

- 예를 들어:

const exUser = await prisma.user.findUnique({
  where: {
    accountId: credentials.accountId as string,
    // 다른 조건들...
  },
  select: {
    password: true,
    // 다른 필요한 필드들...
  }
});

2. authOptions 오류:

- 오류 메시지는 authOptions 객체가 'NextAuthConfig' 형식의 매개변수에 할당될 수 없다고 나타내고 있습니다. 이는 NextAuthPrismaAdapter 간의 호환성 문제로 보입니다.

- 이 문제는 종종 버전 차이 또는 잘못된 타입 정의로 인해 발생할 수 있습니다. 사용 중인 next-auth@auth/prisma-adapter의 버전이 호환되는지 확인하세요.

- 필요한 경우, 라이브러리의 최신 버전으로 업데이트하거나, 호환되는 버전 조합을 찾아야 합니다.

- 또한, PrismaAdapter(prisma) 호출이 올바르게 adapter 필드에 할당되고 있는지 확인하세요.

3. Prisma 스키마:

- Prisma 스키마에는 password 필드가 정의되어 있으며, 기본값이 설정되어 있습니다 (`@default("")`). 이는 비밀번호 필드가 항상 존재함을 의미합니다.

- accountId, email, name 필드는 선택적(`?`)으로 정의되어 있으며, 이는 해당 필드가 null일 수도 있음을 의미합니다.

- findUnique 쿼리에서 이러한 필드들을 올바르게 사용하고 있는지 확인하세요. 선택적 필드는 null일 수 있으므로, 쿼리 조건에서 이를 고려해야 합니다.

이러한 수정을 통해 오류를 해결할 수 있을 것입니다. 오류 메시지를 꼼꼼히 읽고, 필요한 필드가 쿼리에 포함되어 있는지, 사용하는 라이브러리의 버전이 호환되는지 확인하는 것이 중요합니다. 참고해주세요!!

0

황정연님의 프로필 이미지
황정연
질문자

2024. 01. 09. 12:35

제 질문이 너무 허접했었지만 친절한 답변 감사합니다
덕분에 에러 해결과 궁금증이 해소되었습니다.

감사합니다

Su님의 프로필 이미지
Su
지식공유자

2024. 01. 10. 03:46

정연님, 귀하의 질문은 정말 가치 있었습니다! 수강해 주셔서 대단히 감사드립니다. 궁금한 점이 있으시면 언제든지 편하게 질문해 주세요!!