⚛️ React 공부/기초 문법

React JS 심화: 인증과 인가(쿠키, 세션, 토큰, JWT)

seheej 2024. 9. 6. 20:29

1. 인증과 인가의 개념

  • 인증(Authentication): 사용자가 서비스의 회원인지 확인하는 절차입니다. 쉽게 말해 로그인 과정입니다.
  • 인가(Authorization): 인증된 사용자가 특정 리소스에 접근할 권한이 있는지 확인하는 절차로, 로그인 이후 권한 확인 과정입니다.

 

2. HTTP 프로토콜의 특징

HTTP는 무상태(stateless)와 비연결성(connectionless)이라는 중요한 특징을 가집니다.

무상태(stateless)

HTTP는 각 요청이 독립적으로 처리되며, 서버가 이전 요청에 대한 상태를 기억하지 않습니다. 따라서 각 요청마다 클라이언트는 필요한 모든 상태 정보를 담아서 서버에 보내야 합니다.

이 특징 덕분에 Scale-Out이 가능합니다. 서버 상태를 기억하지 않기 때문에 여러 대의 서버로 부하를 분산시켜 처리할 수 있습니다.

비연결성(connectionless)

서버와 클라이언트는 요청을 주고받을 때만 일시적으로 연결되며, 요청이 끝나면 연결이 해제됩니다. 이를 통해 서버 자원을 효율적으로 관리할 수 있습니다.

 

3. 쿠키, 세션, 토큰

무상태와 비연결성에도 불구하고, 로그인 상태를 유지할 수 있는 방법이 있습니다. 바로 쿠키, 세션, 그리고 토큰을 활용하는 것입니다.

(1) 쿠키

  • 쿠키클라이언트(브라우저)에 저장되는 작은 데이터입니다. 서버는 Set-Cookie 헤더를 통해 쿠키를 클라이언트에 전달하고, 클라이언트는 이 쿠키를 요청 시마다 자동으로 서버에 전송합니다.
  • 쿠키는 클라이언트에서 직접 관리(추가/수정/삭제)할 수 있어 보안에 유의해야 합니다.

(2) 세션

  • 세션은 서버에 저장된 사용자 상태 정보를 말합니다. 로그인 후 서버는 세션을 생성하고 sessionId를 클라이언트에 전달하여 쿠키에 저장합니다.
  • 각 요청마다 서버는 sessionId를 확인해 사용자를 인증합니다. 그러나 세션 기반 인증은 서버 메모리를 많이 차지하며, 확장성(서버 확장 시 세션 동기화)이 문제가 될 수 있습니다.

(3) 토큰 기반 인증 (JWT)

  • 토큰은 클라이언트가 보관하는 인증 정보를 의미합니다. 이 방식은 서버의 상태를 유지하지 않으면서도 클라이언트의 인증 상태를 확인할 수 있습니다.
  • **JWT (JSON Web Token)**는 주로 웹에서 사용되는 토큰입니다. 로그인 시 서버는 클라이언트에게 JWT를 발급하고, 클라이언트는 이 토큰을 각 요청에 포함시켜 서버에 전송합니다.

 

4. JWT의 구조와 특징

JWT는 크게 헤더, 페이로드, 서명으로 구성됩니다.

  1. 헤더: 토큰의 타입과 서명 알고리즘을 나타냅니다.
  2. 페이로드: 사용자 정보나 토큰의 만료 시간 등이 포함됩니다.
  3. 서명: 토큰이 위조되지 않았음을 증명합니다.

JWT는 무상태성을 유지하며 확장성 문제를 해결하는 인증 방식입니다. 또한, Access TokenRefresh Token을 사용하여 보안성을 강화할 수 있습니다.