인프런 커뮤니티 질문&답변
작성자 없음
작성자 정보가 삭제된 글입니다.
4. 앱라우터 데이터페칭시 서버 에러 및 클라이언트-서버컴포넌트 수화 에러..
작성
·
27
0
안녕하세요! 강의 듣다가 에러가 발생해서 문의드립니다.
어디가 정확히 에러가 나는지 잘 모르겠어서, 어떻게 해결을 해야할지 모르겟네용...
클라이언트와 서버컴포넌트의 하이드레이션 과정에서 에러가 발생한다고 하는데요ㅠㅠ...
4ch 앱라우터 데이터 패칭 할 때 에러난건데, 서버 에러도 같이 뜹니다!!
아니면 서버의 문제라서 클라이언트-서버컴포넌트 하이드레이션까지 문제가 생긴걸까요??
( 서버는 건드린 적이 없는데 ㅠㅠ )
< 에러 발생 내용 >
hook.js:608 A tree hydrated but some attributes of the server rendered HTML didn't match the client properties.
아래 사진은 서버 vscode 터미널 사진입니당 ㅠ
Invalid this.prisma.book.findMany() invocation in
C:\Users\82106\Desktop\06_onebite-server-main\src\book\book.service.ts:27:35
24 }
25
26 async findAllBooks() {
→ 27 return await this.prisma.book.findMany(
Error querying the database: FATAL: Tenant or user not found
PrismaClientInitializationError:
Invalid this.prisma.book.findMany() invocation in
C:\Users\82106\Desktop\06_onebite-server-main\src\book\book.service.ts:27:35
at In.handleRequestError (C:\Users\82106\Desktop\06_onebite-server-main\node_modules\@prisma\client\runtime\library.js:122:7154)
at In.handleAndLogRequestError (C:\Users\82106\Desktop\06_onebite-server-main\node_modules\@prisma\client\runtime\library.js:122:6188)
답변 3
1
안녕하세요 이정환입니다.
현재는 잘 진행되고 계신가요? 일시적으로 백엔드 서버에 문제가 발생했다면
아마 Supabase 쪽에 문제가 발생하지 않았나 싶습니다. 또 비슷한 증상이 반복되면 꼭 질문으로 남겨주세요
1
0
안녕하세요, 인프런 AI 인턴입니다. 나를응원해님.
클라이언트와 서버 컴포넌트의 하이드레이션 문제와 서버 오류는 꽤 복잡하게 얽혀 있을 수 있습니다. 이러한 에러를 해결하기 위해 아래와 같은 접근 방법을 권장합니다.
1. 클라이언트-서버 하이드레이션 문제
클라이언트와 서버의 렌더링 결과가 일치하지 않는 경우 발생할 수 있는 오류입니다. 이 에러는 서버와 클라이언트 간에 무작위 또는 서버 전용 속성을 일관성 없이 사용할 때 발생할 수 있습니다. 이를 해결하기 위해 다음을 확인해보세요.
- 서버와 클라이언트가 동일한 데이터를 사용: 데이터가 서버에서 전달되고 클라이언트에서도 동일한 값을 가지는지 확인합니다. 가능하다면 클라이언트와 서버가 같은 외부 API를 호출하지 않도록 설정합니다.
- JavaScript의 환경 변수 검사: 클라이언트 히드레일션 과정에서 사용하는 변수들이 적절히 전달되고 있는지, 특히 서버 전용 프로퍼티가 사용되지 않도록 파일에 주의합니다.
- 동시성 문제: 서버 시간이나 무작위 값(
Date.now()나Math.random())과 관련된 부분이 없는지 확인하세요.
2. 서버 오류
Prisma로 데이터베이스를 호출할 때 발생하는 오류로 보이며 이는 데이터베이스 설정 문제에서 기인할 수 있습니다.
- 데이터베이스 연결: 데이터베이스 URL이 올바르게 설정되었는지, 접근 권한이 있는지 확인하세요. 특히 인증 정보가 서버 배포 시 잘 설정되어있는지 검토합니다.
.env파일 검토:.env파일에서 데이터베이스 연결 문자열과 관련된 설정이 정확한지 확인합니다.
- Prisma 설정:
prisma client의 설정 파일과schema.prisma파일을 확인하여 데이터베이스 테이블과 클라이언트 설정이 바르게 되어 있는지 점검합니다.
관련된 유사한 케이스는 아래 링크를 통해 확인하실 수 있습니다:
- “Next.js에서 하이드레이션 오류 해결 방법”
- “Prisma와 데이터베이스 연결 문제 해결”
위의 방법들이 도움이 되길 바라며, 추가적인 질문이 있으시면 계속해서 남겨주세요. 추가로 문제가 지속될 경우 좀 더 구체적인 코드 부분이나 설정 파일을 함께 제공해 주시면 보다 정확한 도움을 드릴 수 있을 것 같습니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.
넵 답변 감사합니다!!!
내일부터 엄청 추워진대요!! 감기조심하세용