핵심 요약
올리브영의 iframe 인증 사례에서 postMessage를 활용해 토큰 기반 인증을 구현하고, 동시성 제어와 자동 재시도로 안정성과 성능을 개선했습니다.
구현 방법
- 자식 iframe과 부모 간 token 공유 구조를 postMessage로 구성
- 동시 API 요청은 Promise 공유 패턴으로 1회 토큰 갱신만 수행하도록 큐잉
- Axios 인터셉터로 401 발생 시 갱신 작업을 대기 중인 요청에 재전송
- 갱신 실패에 대한 쿨다운(최대 3회, 5초) 도입
- Origin 검증과 Rate Limiting으로 보안 강화
주요 결과
- 동시 API 호출에서 불필요한 토큰 요청 95% 감소
- 토큰 발급 API 호출 수 대폭 감소
- 무한 재시도 방지로 서버 부하 감소
