JWT : Json Web Token - Access Token, Refresh Token으로 이뤄져 있음
Access Token을 axios 헤더로 설정해 인증된 사용자임을 서버에 알려 api 통신함 (로컬 스토리지에 저장하지 않음)
만료 시간이 있기 때문에 만료 시, Refresh Token을 이용해 Access Token을 다시 발급 받음.
클라이언트(프론트)가 보낸 Refresh Token과 DB에 있는 Refresh Token 일치 시, 새 Access Token과 Refresh Token이 발급 됨
Access Token은 로컬스토리지, 쿠키 등에 저장하지 않았으므로 새로고침, 브라우저 종료 시 사라짐
Refresh Token은 로컬 스토리지/쿠키에 저장 (새로고침, 브라우저 종료 시에도 남아있음)
Silent Refresh 함수를 이용해 자동으로 로그인 연장을 시켜줌. (Silent Refresh 호출 시점은 로그인 성공 후, 페이지 리로드 될 때 등)
새로 받은 Access Token으로 axios 헤더를 교체하고, 새로 받은 Refresh Token도 로컬스토리지/쿠키에 교체
참고
https://velog.io/@yaytomato/프론트에서-안전하게-로그인-처리하기
https://han-um.tistory.com/17
'Web' 카테고리의 다른 글
| [Backend] AWS ec2 서버 시간 설정 (0) | 2023.10.12 |
|---|---|
| [Backend] node.js + next.js API Routes 기초 (0) | 2023.10.11 |
| [Frontend] Node.js, Babel, Webpack (1) | 2023.05.19 |
| [React] setState, props (0) | 2021.08.31 |
| [Backend] JPA 정리 (0) | 2021.08.20 |