로그인 여부 관리

최초의 로그인 이후에는, 브라우저의 저장소인 localStorage 또는 sesssionStorage 에 데이터를 저장하는 방법을 이용해서 로그인 여부와 사용자 정보를 관리하는 방법

로그인 후, JWT 로 사용자 정보를 매번 요청할 필요없이, 클라이언트에서 바로 정보를 가져오도록 하여 서버 측의 로드을 줄일 수 있다.

항목	localStorage	sessionStorage
저장 기간	브라우저 종료 후에도 데이터가 유지됩니다.	브라우저 탭이 닫히면 데이터가 삭제됩니다.
저장 용량	보통 5MB 정도 (브라우저에 따라 다를 수 있음)	보통 5MB 정도 (브라우저에 따라 다를 수 있음)
용도	지속적인 데이터 저장 (로그인 정보, 사용자 설정 등)	세션 동안만 필요한 데이터 저장 (페이지 간 이동 등)
데이터 유지	페이지를 새로 고침하거나 브라우저를 종료해도 데이터가 남아 있음	페이지를 새로 고침하면 데이터가 남아 있으나, 브라우저를 종료하면 삭제됨
저장 방식	key-value 형식, 문자열만 저장 가능	key-value 형식, 문자열만 저장 가능
API	localStorage.setItem(), localStorage.getItem() 등	sessionStorage.setItem(), sessionStorage.getItem() 등
예시 사용	로그인 상태, 사용자 테마 설정 등	로그인 세션, 페이지 상태 등

새로운 렌더링마다 서버로 사용자 정보 요청을 하지 않고, 클라이언트에서 관리하여 가져오도록 관리한다.

최로 로그인

localStorage 에 로그인 정보(로그인 여부, 사용자 정보, 권한 정보)를 등록

로그인 정보 관리

localStorage 에서 로그인 정보를 가져온다

localStorage 로그인 정보가 없으면, JWT 확인한다

JWT 존재하면, 서버에 사용자 정보 요청하여 localStorage 에 등록

새로운 화면에서 로그인 정보 확인 시, localStorage 에서 가져온다