JWT(JSON Web Token)

Juni_woo·2025년 6월 17일
0

웹 개발 지식

목록 보기
2/2
post-thumbnail

0. JWT란?

JWT(JSON Web Token)사용자 인증 저오와 추가 데이터를 JSON 형태로 담아서 암호화한 문자열이다.

즉, 이 사용자가 누구인지를 증명할 수 있게 해주는 디지털 서명된 토큰인 것이다.

ex)

eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.
eyJ1c2VySWQiOjEsInJvbGUiOiJ1c2VyIn0.
s7Kfj3VfknBvS9vU8HnV9zUpAbWQqf7sn9UiEqlP3ko

이 문자열은 아래와 같이 총 3부분으로 나뉘어 있다.


부분설명
Header토큰 타입, 서명 알고리즘
Payload사용자 정보 (ex. userId, role 등)
Signature서버가 발급할 때 서명한 값 (변조 방지용)

1. 왜 JWT를 사용하나?

📊세션 방식과 JWT를 비교해보자

항목세션 방식JWT 방식
저장 위치서버 메모리(또는 Redis 등)클라이언트가 JWT를 저장
서버 확장성불리함 (세션 동기화 필요)유리함 (무상태/Stateless)
인증 방식서버가 세션ID로 사용자 식별클라이언트가 JWT로 사용자 식별

JWT는 서버에 상태를 저장하지 않고도 인증을 유지할 수 있기 때문에 마이크로서비스, 모바일 앱, 서버간 통신 등에서 효율적이다.


3. 프론트엔드에서 JWT의 활용

1. 로그인시 토큰 받기

// 예: 로그인 API 호출 결과
const response = await axios.post("/login", { id, password });
const token = response.data.token;

2. 서버에서 받은 토큰을 저장
브라우저 저장소에 저장(권장: HttpOnly 쿠키 또는 LocalStorage)

// 예시 (간단하게 localStorage에 저장)
localStorage.setItem("token", token);

보안상 안전한 방식은 HttpOnly 쿠키 사용이다.

3. API 호출 시 토큰을 함께 전송
서버가 인증된 요청인지 확인하려면, JWT를 헤더에 넣어서 보내야 한다.

// 예: 게시글 목록 요청 시
const token = localStorage.getItem("token");

axios.get("/api/posts", {
  headers: {
    Authorization: `Bearer ${token}`
  }
});

4. 서버는 토큰을 검사

  • 서버는 요청이 올 때마다 JWT를 검사하여 유효한 사용자면 응답을 해준다.
  • 보통 Spring Boot에서는 필터나 인터셉터에서 검사를 처리한다.

4. JWT 사용 시나리오

회원가입 & 로그인
1. 로그인 성공 -> JWT 발급
2. 프론트는 JWT를 저장
3. 이후 모든 요청에 JWT를 헤더에 넣음
4. 서버는 JWT를 검사해 요청한 사람이 누구인지 파악


5. 주의할 점

  1. JWT 탈취 시 큰 위험 -> Https + HttpOnly 쿠키 권장
  2. 만료 시간 설정 필수
  3. JWT는 섭버에서 무효화 불가 -> 때문에문에 짧은 유효시간 + RefreshToken을 같이 사용하기도 한다.
profile
개발 공부!

0개의 댓글