토큰 저장 방식: 로컬 저장소 vs 쿠키
액세스 토큰 (Access Token)
액세스 토큰은 사용자가 인증을 받은 후, 서버에서 제공되는 짧은 수명의 토큰입니다. 클라이언트는 이 토큰을 이용하여 서버에 인증된 요청을 보냅니다.
- 장점:
- 짧은 유효 기간으로 보안성이 높음
- 인증이 필요한 요청에 자동으로 포함됨
- 단점:
- 짧은 유효 기간으로 인해 자주 갱신이 필요
- 유출되면 보안 위험이 존재
리프레시 토큰 (Refresh Token)
리프레시 토큰은 액세스 토큰이 만료되었을 때 새로운 액세스 토큰을 발급받기 위해 사용됩니다. 리프레시 토큰은 더 긴 수명을 가집니다.
- 장점:
- 액세스 토큰이 만료되어도, 리프레시 토큰으로 자동 갱신 가능
- 서버에서 직접 관리하여 보안성이 높음
- 단점:
- 유출 시, 악용될 위험이 있음
- 관리가 더 복잡함
저장 위치 및 보안
LocalStorage
- 장점:
- 클라이언트 측에서 쉽게 저장하고 관리 가능
- 브라우저에서 제공하는 API로 액세스하기 쉬움
- 서버 사이드 설정 없이 클라이언트만 관리 가능
- 단점:
- XSS 공격에 취약: 악성 스크립트가 삽입되면 쉽게 접근될 수 있음
- 만료된 액세스 토큰을 관리하기 어려움
- 쿠키와 달리 자동으로 서버 요청에 포함되지 않음
Cookies
- 장점:
httpOnly속성을 통해 JavaScript에서 접근할 수 없어서 XSS 공격에 더 안전secure플래그와sameSite옵션을 활용하여 HTTPS와 CSRF 공격을 방지할 수 있음- 서버 측에서 쉽게 관리 가능
- 단점:
- CSRF 공격에 취약할 수 있음, 하지만
sameSite옵션을 통해 예방 가능 - 크기 제한이 있어 대용량 데이터를 저장할 수 없음 (4KB 제한)
- 요청 시 자동으로 포함되므로, 서버 측에서 더 많은 설정이 필요
- CSRF 공격에 취약할 수 있음, 하지만
보안 이슈: XSS 및 CSRF 공격
XSS (Cross-Site Scripting)
- LocalStorage: JavaScript로 쉽게 접근 가능하여 악성 스크립트가 토큰을 탈취할 수 있음
- Cookies:
httpOnly쿠키로 JavaScript에서 접근 불가하므로 XSS 공격에 더 안전
CSRF (Cross-Site Request Forgery)
- Cookies: 쿠키는 브라우저가 자동으로 전송하기 때문에 CSRF 공격에 취약할 수 있음. 이를 방지하기 위해
sameSite플래그와 anti-CSRF tokens를 활용할 수 있음 - LocalStorage: XSS 공격에 더 취약하지만 CSRF 공격에는 영향 없음
저장 방식 전략
방법 1: LocalStorage 사용
- 액세스 토큰을
localStorage에 저장하고, 리프레시 토큰은localStorage나 쿠키에 저장- 장점: 설정이 간단하고 서버 측 관리가 필요 없음
- 단점: XSS 공격에 취약하며, 토큰 탈취 시 보안 리스크가 있음
방법 2: Cookies 사용
- 액세스 토큰과 리프레시 토큰을 모두
httpOnly쿠키에 저장- 장점: XSS 공격으로부터 보호되며, 자동으로 요청에 포함됨
- 단점: CSRF 공격에 취약할 수 있지만,
sameSite와 anti-CSRF tokens로 예방 가능
방법 3: 메모리 저장 (액세스 토큰) + 쿠키 저장 (리프레시 토큰)
- 액세스 토큰은 메모리에 저장하고, 리프레시 토큰만
httpOnly쿠키에 저장- 장점: 액세스 토큰이 노출되지 않아 XSS 공격에 안전함. 리프레시 토큰을 통해 새로운 액세스 토큰을 발급받을 수 있음
- 단점: 페이지 리프레시 시 액세스 토큰이 사라지며, 리프레시 토큰을 사용해 갱신해야 함
👍 권장 저장 방식
- 액세스 토큰은
localStorage또는 메모리에 저장하고, 리프레시 토큰은httpOnly쿠키에 저장합니다. - CSRF와 XSS 공격을 방지하려면, 쿠키에
sameSite플래그와 anti-CSRF tokens를 사용합니다. - 세션 관리 및 토큰 갱신을 서버 측에서 안전하게 관리하도록 합니다.

