피드로 돌아가기
Dev.toSecurity
원문 읽기
XSS 방어와 세션 연속성 확보를 위한 In-Memory 기반 Auth 설계
Authentication on the Frontend - More Than Just Tokens
AI 요약
Context
localStorage 기반 토큰 저장 방식의 XSS 취약점과 짧은 Access Token 만료 주기로 인한 사용자 경험 저하 문제를 분석. 1,000만 명 이상의 활성 사용자를 보유한 OTT 서비스 규모에서 세션 하이재킹 및 잦은 로그아웃이 초래하는 시스템 리스크를 해결하고자 함.
Technical Solution
- XSS 공격을 통한 토큰 탈취 차단을 위해 Access Token을 JavaScript 변수 기반 In-Memory Storage에 저장하는 구조 설계
- Persistence 결여 문제를 해결하고자 Refresh Token을 httpOnly Cookie에 저장하여 브라우저 JS 접근을 원천 차단한 Silent Refresh 메커니즘 도입
- 토큰 만료 60초 전 자동 갱신을 수행하는 스케줄링 로직을 통해 사용자 중단 없는 Seamless한 세션 유지 구현
- 다수의 API 동시 호출 시 발생하는 중복 갱신 요청을 방지하기 위해 단일 Promise를 공유하는 Refresh Promise Guard 패턴 적용
- 백그라운드 탭의 타이머 제한(Throttling) 문제를 해결하기 위해 포커스 복귀 시점에 토큰 만료 여부를 즉시 검증하는 로직 추가
- URL 파라미터 노출을 배제하고 Authorization Header를 통한 토큰 전송으로 브라우저 히스토리 및 서버 로그 유출 경로 차단
실천 포인트
- Access Token 저장소로 localStorage 대신 In-Memory 변수 사용 검토 - Refresh Token의 httpOnly 및 SameSite 속성 설정 여부 확인 - 토큰 갱신 로직에 Race Condition 방지를 위한 Promise 싱글톤 패턴 적용 - 프론트엔드의 권한 체크를 단순 UI 제어로 한정하고 API 서버에서 최종 Authorization 검증 수행