학습 정리 - JWT 구조, Djoser, Context API 정리 (2025.05.01)

수아·2025년 5월 1일
0

학습 정리

목록 보기
50/51
post-thumbnail

회고 리스트

1. JWT 토큰에서 아래를 설명하시오.

부분설명예시
Header사용된 암호화 알고리즘과 타입 정보{"alg": "HS256", "typ": "JWT"}
Payload유저 정보, 토큰 타입, 만료 정보 등 (Base64 인코딩된 공개 데이터){"user_id": 1, "exp": 1712345678}
SignatureHeader + Payload를 서버 비밀키로 해싱한 서명 (위조 방지용)HMAC-SHA256

2. JWT에서 Access Token과 Refresh Token을 분리해서 사용하는 이유는?

항목설명
Access Token인증 요청 시 사용, 유효기간 짧음 → 탈취되더라도 영향 최소화
Refresh TokenAccess 만료 시 재발급 용도로 사용, 유효기간 김

보안성과 편의성 균형을 맞추기 위해 분리해서 사용한다.
Access 토큰은 짧게, Refresh 토큰은 길게 설정해서 자주 로그인하지 않아도 되게 하면서 보안을 유지할 수 있다.

3. Djoser 는 무엇이며, Djoser 쓰게 되면 장점은?

- Djoser란?

Djoser는 Django에서 회원가입, 로그인, 비밀번호 재설정 등 인증 기능을 API 형태로 자동 제공하는 라이브러리이며 DRF(Django Rest Framework) 기반으로 동작한다.

- 장점

: 복잡한 회원 시스템을 손쉽게 API로 구현 가능
: 회원가입 / 로그인 / 탈퇴 등 엔드포인트 자동 제공
: JWT, Token 등 다양한 인증 방식과 연동 가능
: 커스터마이징이 비교적 쉬움

엔드포인트 란?
클라이언트(브라우저, 앱 등)가 서버에 요청을 보낼 수 있는 "주소(URL)"

엔드포인트메서드설명
/api/auth/users/POST회원가입
/api/auth/jwt/create/POST로그인 (JWT 발급)
/api/auth/jwt/refresh/POSTAccess Token 재발급
/api/auth/users/me/GET내 정보 가져오기
/api/auth/users/reset_password/POST비밀번호 재설정

4. 리액트에서 context api 에 관한 구성요소 3단계 간단한 코드를 예를들어 설명하시오.

- Context 생성

import { createContext } from "react";
export const ThemeContext = createContext();

- Provider로 감싸기

<ThemeContext.Provider value={"dark"}>
  <App />
</ThemeContext.Provider>

- useContext로 값 접근하기

import { useContext } from "react";
import { ThemeContext } from "./ThemeContext";

const MyComponent = () => {
  const theme = useContext(ThemeContext);
  return <div>현재 테마는 {theme}</div>;
};

5. React의 Context API를 언제 사용 좋은지 아래의 예 이외의 것이 있으면 정리해 보세요.

  • 로그인 상태 관리 (user info, JWT 토큰 등)
  • 장바구니, 알림 등 전역적으로 필요한 데이터
상황설명
다국어(i18n) 설정전역 언어 설정 관리
테마 설정 (다크모드 등)모든 페이지에서 테마 정보 공유
권한/역할 관리admin, user, guest 같은 유저 권한 상태 공유
현재 재생 중인 음악 정보플레이어가 어디에 있든 현재 곡 정보 유지

📌 정리 한 줄
JWT의 구조를 이해하고, 인증 흐름에서 Access/Refresh를 구분하며, Djoser와 React Context API를 통해 인증/전역 상태를 효율적으로 관리할 수 있다.

0개의 댓글