Closed ryungom closed 1 month ago
기본로그인 추가 설정
최상위 root page에 로그인 정보가 담긴 Session을 전역 설정
<body> <SessionProvider session={session}> <Header isMain={isMain} /> {children} <Footer/> </SessionProvider> </body>
이후 하위 컴포넌트 어디에서든 Session에 담긴 로그인정보 호출 가능. ( useSession은 클라이언트 컴포넌트 한정, 서버컴포넌트는 getServerSession 함수 필요.)
import { signOut, useSession } from 'next-auth/react'; const { data:session, status } = useSession(); // 값 호출시에는 session.user키값 등등으로 시작하여 호출하면 됌
header 컴포넌트의 로그인 부분에 '로그아웃' 임시 추가. 로그아웃 버튼(...정확히는...버튼은아니고 임시로 li로 만듦) 클릭시 Session 데이터 전부 삭제, route "/" 이동.
모건님이 넘겨받아서 작업해주실 추후 로그인 사항 (훝어보며 체크했던 사항)
로그인하고 redirect가 코드상으로 이루어지지 않음. UI상으로는 이동하지만 데이터는 fetch되지 않고 화면만 이동. 단 새로고침할 경우 로그인정보가 호출됌 (이 부분이 제일 중요함)
DB에 존재하지 않거나 틀린 아이디, 비밀번호로 로그인할 경우 알람창이 뜨지 않음.
header 컴포넌트의 로그인상태에 따른 로그인/로그아웃 구분 (tsx 부분 작업하기 편하시라고 띄워쓰기로 공간 만들어두었습니다...ㅎㅎ)
로그인 정보가 담긴 session을 다루는 방법이군요! provider를 사용해서 관리하는 법 잘 배웠습니다 🤗 감사합니다! 👍
✍️ PR 한 줄 요약
✏ 상세 작업 내용
기본로그인 추가 설정
최상위 root page에 로그인 정보가 담긴 Session을 전역 설정
이후 하위 컴포넌트 어디에서든 Session에 담긴 로그인정보 호출 가능. ( useSession은 클라이언트 컴포넌트 한정, 서버컴포넌트는 getServerSession 함수 필요.)
header 컴포넌트의 로그인 부분에 '로그아웃' 임시 추가. 로그아웃 버튼(...정확히는...버튼은아니고 임시로 li로 만듦) 클릭시 Session 데이터 전부 삭제, route "/" 이동.
모건님이 넘겨받아서 작업해주실 추후 로그인 사항 (훝어보며 체크했던 사항)
로그인하고 redirect가 코드상으로 이루어지지 않음. UI상으로는 이동하지만 데이터는 fetch되지 않고 화면만 이동. 단 새로고침할 경우 로그인정보가 호출됌 (이 부분이 제일 중요함)
DB에 존재하지 않거나 틀린 아이디, 비밀번호로 로그인할 경우 알람창이 뜨지 않음.
header 컴포넌트의 로그인상태에 따른 로그인/로그아웃 구분 (tsx 부분 작업하기 편하시라고 띄워쓰기로 공간 만들어두었습니다...ㅎㅎ)
✅ PR 양식 체크리스트