목록 보기
Keycloakify의 page_hint 상태 관리 개선
프론트엔드

Keycloakify의 page_hint 상태 관리 개선

넥스트리
넥스트리
2026년 6월 30일

두줄요약

Keycloakify의 라운드트립 구조 때문에 `page_hint`를 단순히 React 상태처럼 다루면 새로고침 시 화면이 바뀌는 문제가 있었습니다. 마운트 시 무조건 삭제하던 로직을 진입 흐름에 맞게 조정해 직원 계정 최초 설정 화면을 유지했습니다.

문제 상황

  • Keycloakify 기반 로그인/계정 화면에서 직원 계정 최초 설정 화면이 새로고침 시 일반 비밀번호 찾기 화면으로 바뀌는 현상
  • 화면 구분 값 page_hintsessionStorage와 URL에서 관리되지만, 마운트 직후 삭제되어 상태 유지 실패

원인 분석

  • Keycloakify는 React SPA처럼 내부 상태만으로 화면을 전환하지 않고, Keycloak 라운드트립을 거쳐 전체 페이지가 다시 그려짐
  • page_hint가 화면 유지와 흐름 구분 두 역할을 동시에 맡아, 한쪽에서는 유지·다른 쪽에서는 삭제가 필요한 충돌 발생
  • LoginResetPasswordContainerLoginUpdatePasswordContainer의 진입 경로가 달라 같은 삭제 로직을 일괄 적용할 수 없음

해결 방법

  • 직원 계정 최초 설정용 재설정 컨테이너에서 마운트 시 page_hint 삭제 로직 제거
  • 마이페이지 비밀번호 변경용 업데이트 컨테이너의 방어적 삭제 로직은 유지
  • 진입 시점에 이미 page_hint를 명시적으로 세팅하는 흐름을 기준으로 상태 관리 정리

다음 읽기

#Keycloak 주제를 이어서 읽기

Keycloak 토큰 교환으로 인증 시스템 구축

Keycloak 토큰 교환과 구형 V1 대행 방식을 이용해 외부 파트너 연동 인증 구조를 구성한 사례입니다. 클라이언트 신뢰 관계 설정과 자주 발생하는 에러 대응 방법도 함께 정리했습니다.

넥스트리
넥스트리
백엔드

댓글 0

댓글을 작성하려면 로그인이 필요합니다.

댓글을 불러오는 중...