브라우저 재 접속 시 로그인 상태 유지
안녕하세요.
브라우저 재 접속 시 로그인 상태 유지를 하고 싶습니다.
로그인 후 어플리케이션의 쿠키에 refreshToken이 담긴 것을 확인하였습니다.
브라우저를 재접속하면 refreshToken이 사라져있는데 이것은 브라우저를 종료하면 쿠키가 휘발되는 성질로 인해 사라지는 것이 맞나요? 그렇다면 브라우저 재접속 시 로그인 상태 유지는 어떻게 구현할 수 있는지 궁금합니다.
감사합니다.
답변 2
1
안녕하세요! 용준님!
해당 요구사항을 만족하기 위해서는 백엔드 API의 변경이 필요할 것 같습니다!
아래 설명을 참고해 보세요!
로그인 구현시 브라우저에 저장하기 위해 크게 4가지 정도의 저장소를 소개 드렸던 것 같아요!
로컬스토리지
세션스토리지
쿠키
변수
여기서, 브라우저를 종료하고 다시 접속하더라도 정보를 유지할 수 있는 저장소는 로컬스토리지, 쿠키 정도가 될 것 같아요!(단, 쿠키는 만료일자가 설정되어 있는 경우에 한해서 입니다)
해당 수업에서 제공하는 refreshToken은 보안 목적상 자바스크립트로 건드릴 수 없도록 httpOnly로 만들어 졌어요!
따라서, refreshToken을 꺼내어 로컬스토리지에 다시 담는 것은 어렵습니다.
또한, refreshToken을 꺼내어 만료일자를 설정하여 다시 쿠키에 재저장 하는 것도 어렵습니다.
결론적으로는, 해당 보안 수준을 유지하며 브라우저 종료시에도 쿠키를 유지하기 위해서는 쿠키의 만료일자를 설정하여 브라우저에 전송하도록 백엔드 API의 변경이 필요할 것 같네요!
0
안녕하세요, 인프런 AI 인턴이에요.
브라우저를 종료하면 쿠키가 휘발되어 refreshToken이 사라지는 것은 맞습니다. 쿠키는 일반적으로 클라이언트(브라우저)에 저장되며, 브라우저가 종료될 때 함께 삭제되기 때문에 쿠키에 refreshToken을 저장하면 브라우저 재접속 시 로그인 상태 유지를 구현할 수 없습니다.
로그인 상태 유지를 위해서는 refreshToken을 서버에 저장하거나 다른 저장소를 이용해야 합니다. 그 중 일반적으로 사용되는 방법은 다음과 같습니다.
세션 저장소: 서버에 refreshToken을 저장하는 가장 일반적인 방법입니다. 클라이언트가 로그인을 요청하면 서버에서 refreshToken을 발급하고 세션 저장소에 저장합니다. 클라이언트에게는 세션 ID를 전달하고, 이 세션 ID를 통해 서버에서 저장한 refreshToken을 가져올 수 있습니다. 클라이언트가 재접속할 때마다 세션 ID를 이용해 로그인 상태를 확인할 수 있습니다.
로컬 스토리지/세션 스토리지: 클라이언트 측에 로그인 상태를 저장하는 방법입니다. 브라우저의 로컬 스토리지(localStorage)나 세션 스토리지(sessionStorage)에 refreshToken을 저장하고, 재접속 시 해당 스토리지에서 refreshToken을 가져와 로그인 상태를 확인합니다.
JWT(Json Web Token): 로그인 시 서버에서 발급된 JWT를 클라이언트에게 전달하고, 클라이언트는 이를 로컬 스토리지에 저장합니다. 클라이언트가 재접속할 때마다 JWT를 이용해 로그인 상태를 확인합니다.
이러한 방법들 중 선택하여 구현하면 브라우저 재접속 시 로그인 상태를 유지할 수 있습니다. 선택한 방법에 따라 클라이언트와 서버 사이의 통신 방법과 알고리즘 등이 달라질 수 있으니 자세한 구현 방법은 선택한 방법에 관련된 자료를 참고해주세요.
더 궁금한 점이 있으시면 언제든지 질문해주세요. 좋은 하루 되세요!
fetchBoardsOfMine, fetchBoardsCountOfMine 에러 문의드립니다
0
40
1
댓글 기능 구현 중 질문드립니다.
0
67
1
쿠폰코드 발급
0
140
2
example 서버 플레이그라운드, API 접속 모두 안됩니다.
0
87
2
문의드립니다!! ㅠㅠ
0
104
2
graphql 백엔드 서버가 포폴용 빼곤 접속이 안됩니다.
0
78
2
_app.js 작성 이후로 에러가 발생하네요
0
95
2
학습자료
0
71
2
학습자료가 안열립니다.
0
51
2
플레이 그라운드 퀴즈 문제 질문이 있습니다.
0
61
0
기존강의 구매자, 업데이트 끝인가요?
0
111
3
업데이트 버전 수강
0
89
2
완벽한 프론트엔드
0
136
2
나만의 쇼핑몰 샘플 페이지 접속 확인부탁드립니다.
0
84
1
graphql 접속이 안됩니다.
0
101
2
const, let 사용 질문 드립니다.
0
71
2
싸이월드 만들기 1탄 피드백 부탁드립니다.
0
122
2
회원가입 과제 피드백 부탁드립니다.
0
81
2
styled.span / styled.input "CSS 자동완성"
0
47
1
쿠폰 발급 관련
0
167
2
서버 502 error
0
247
2
쿠폰 다시 부탁드려도 될가여?
0
140
2
a태그 패딩했을때 왜 크기가 줄어들지 않고 늘어나나요
0
185
2
2분 44초 질문
0
132
3





