← 카탈로그

Frontend Auth Session — 토큰 세션·부트스트랩 복원·전송 주입

feature⊕ 2 servicesspearvcraft

로그인한 다음, 브라우저가 "나 아까 로그인했잖아" 를 계속 기억하고 다니는 방법이에요. 출입증(토큰)을 잘 보관하고, 새로고침해도 되살리고, 요청마다 자동으로 내밀어요.

비유: 놀이공원 손목 도장 🎡

입장할 때 손등에 도장을 찍어주죠? 그 뒤론 매번 표를 안 보여줘도 도장만 보여주면 통과해요.

  • 손목 도장(출입증 토큰) = 로그인했다는 증거. 매 요청에 이걸 슥 내밀어요.
  • 도장을 어디에 찍나(저장소) = 손등에? 주머니 티켓에? 아니면 머릿속에만? — 각각 장단점이 달라요.
  • 유효시간 = 도장은 몇 시간 지나면 흐려져요. 그때 재발급 도장(refresh) 으로 새로 찍어요.

도장을 어디에 보관할까 (트레이드오프)

정답은 없어요. 관리자 페이지처럼 다시 로그인해도 부담 없으면 "머릿속"이 안전하고, 계속 켜두는 앱이면 "주머니 티켓"이 편해요. 앱 성격에 맞게 골라요.

새로고침해도 되살아나기 (부트스트랩)

페이지를 새로고침하면 화면은 처음부터 다시 그려져요. 이때 저장해둔 도장이 아직 쓸 만한지 확인해서 로그인 상태를 되살려요.

팁 하나: 도장에 "3시간 뒤 만료" 라고 상대 시간으로 적어두면 매번 계산해야 해서 번거로워요. 대신 "오후 5시에 만료" 라고 정확한 시각으로 바꿔 적어두면, 만료 판정이 "지금이 5시 넘었나?" 한 줄로 끝나요.

요청마다 도장 자동으로 내밀기

로그인 뒤엔 서버에 뭘 물어볼 때마다 도장을 보여줘야 해요. 근데 매번 손으로 챙기면 깜빡하기 쉽죠. 그래서 중간에 자동 도우미를 세워둬요. 요청이 나갈 때마다 도우미가 알아서 도장을 붙여줘요.

이렇게 해두면 화면을 만드는 사람은 도장을 신경 쓸 필요가 없어요. 도우미가 항상 챙기니까요.

핵심만 다시

  1. 로그인 상태 = 출입증 도장을 들고 다니며 매 요청에 내미는 것.
  2. 도장을 어디 보관하나는 트레이드오프 — 편함(주머니) vs 안전(머릿속)을 앱 성격에 맞게 골라요.
  3. 새로고침하면 저장된 도장이 쓸 만한지 확인해 로그인 상태를 되살려요. 흐려졌으면 재발급 도장으로 새로 찍고요.
  4. 자동 도우미가 요청마다 도장을 붙여줘서 화면 코드가 깔끔해져요.

더 자세한 진짜 코드·설계는 옆의 개요 / Variants / Apply Recipe 탭에서 볼 수 있어요.