1. 문제 정의
기존의 세션 로그인 방식에서 벗어나서, JWT를 활용한 로그인 방식으로 변경하였습니다.
변경하게 된 이유로는, refresh token을 사용한 자동 로그인을 학습해보기 위해서 도입하였습니다.
2. JWT 로그인 플로우
JWT와 카카오 OAuth2.0 로그인의 플로우를 시퀀스 다이어그램으로 살펴보도록 하겠습니다.
![login](https://user-images.githubusercontent.com/115435784/285692263-d5416bb1-8b2a-46fb-9334-33419180f0b8.png)
- refresh token이 있는지 확인합니다.
- refresh token이 만료됐거나 없는 경우, 카카오 로그인을 진행합니다.
- 카카오 서버로부터, 사용자 정보에 대한 access token을 발급받습니다.
- access token 내부에 있는 사용자의 카카오 ID가 연세골프 DB에 저장되었는지 확인합니다.
- DB에 없을 경우 401 에러를 반환하고, 로그인 페이지로 리다이렉트 합니다.
- DB에 저장된 경우 다음 단계로 넘어갑니다.
- access token과 refresh token을 발급합니다.
- cookie에 refresh token을 저장합니다.
- secure 옵션을 통해, https 통신만 가능하도록 합니다.
- http-only 옵션을 통해, JavaScript와 같은 클라이언트 사이드 스크립트로부터 접근할 수 없도록 합니다.
- 이를 통해 Cross-Site Scripting (XSS) 공격을 통해 쿠키가 탈취되는 것을 방지합니다.
다음은 refresh token을 persistent cookie로 생성하는 과정입니다.
private void createRefreshToken(HttpServletResponse response, String refreshToken) {
Cookie cookie = new Cookie("refreshToken", refreshToken);
cookie.setHttpOnly(true); // HTTP Only 설정
cookie.setSecure(true); // Secure 설정
cookie.setPath("/"); // 경로 설정
cookie.setMaxAge(60 * 60 * 24 * 14); // 2주일
response.addCookie(cookie); // 응답에 쿠키 추가
}
3. Refresh Token이 있을 경우
![refresh token](https://user-images.githubusercontent.com/115435784/285692288-cc2a681a-791b-4eef-a75d-81201cd6a855.png)
refresh token이 있을 경우 로그인의 과정을 생략할 수 있습니다.
클라이언트 코드에서 홈페이지에 접근할 때, refresh token이 있다면 refresh token을 통한 access token 발급을 시도할 수 있습니다.
유효한 refresh token이 존재한다면, 로그인 과정 없이 로그인을 유지할 수 있게 됩니다.
4. Session Cookie VS Persistent Cookie
- Session Cookie : 브라우저가 닫히면 자동으로 삭제됩니다. 사용자가 브라우저를 닫으면 로그아웃 되는 것과 유사합니다. 세션 쿠키는 일시적인 정보 저장에 적합합니다.
- Persistent Cookie: 미리 정해진 기간 동안 데이터를 유지합니다. 사용자가 브라우저를 닫아도 쿠키는 유지되어 사용자가 웹사이트를 재방문할 때 자동 로그인과 같은 기능을 제공할 수 있습니다.
JWT Token 관리 방법
- Access Token: 엑세스 토큰은 짧은 수명을 가지므로, 세션 쿠키에 저장하는 것이 일반적입니다. 브라우저가 닫히면 자동으로 사라지며, 로그아웃 됩니다.
- Refresh Token: 상대적으로 긴 수명을 가지며, 사용자가 브라우저를 닫았다가 다시 열 때, 자동으로 액세스 토큰을 재발급 받는데 사용될 수 있기 때문에, Persistent Cookie에 저장합니다.
- refresh token은 매우 중요하므로, HttpOnly 및 Secure 플래그를 반드시 설정해야 합니다.
'Yonsei Golf' 카테고리의 다른 글
Email 성능 개선기 (0) | 2023.12.09 |
---|---|
모니터링 with Docker (0) | 2023.12.09 |
CloudFront, S3 배포 자동화 (2) | 2023.11.26 |
Alert 개선기 (0) | 2023.11.18 |
코드 개선기 - YonseiGolf Email API (0) | 2023.10.31 |