iframe으로 웹앱 통합했더니 토큰 요청이 폭발했다

본 글은 올리브영에서 리테일 미디어 사업 확장을 위해 광고 파트너 오피스 시스템을 기존 플랫폼과 통합하는 과정에서 발생한 문제를 다룹니다. 부모 애플리케이션에서 자식 애플리케이션을 iframe으로 임베드하면서, 사용자가 두 번 로그인할 필요 없이 인증을 공유하는 것이 목표였습니다.

하지만 동시 토큰 요청 폭발, 401 에러 연쇄 발생, 무한 재시도 루프 등 예상치 못한 난관에 부딪혔습니다. 이 문제를 해결하기 위해 postMessage API와 Promise 패턴을 활용하여 동시 요청을 최적화하고, 401 에러를 효율적으로 처리하며, 무한 루프를 방지하고 보안을 강화하는 안정적인 인증 시스템을 구축했습니다.

iframe 환경에서의 마이크로프론트엔드 아키텍처 구현, 크로스 오리진 환경에서의 안전한 토큰 관리, 동시 401 에러 처리 등에 관심 있는 개발자에게 유용한 정보를 제공합니다.