HTTP 쿠키 & 세션
웹 개발에서 사용자 상태를 관리하는 것은 필수적입니다. HTTP는 기본적으로 무상태(stateless) 프로토콜이기 때문에, 각 요청은 독립적이며 이전 요청에 대한 정보를 기억하지 않습니다. 이러한 한계를 극복하기 위해 쿠키와 세션이라는 중요한 개념이 등장했습니다.
쿠키(Cookie)란 무엇인가?
쿠키의 개념
쿠키는 웹 서버가 사용자의 브라우저에 저장하는 작은 텍스트 파일입니다. 사용자가 웹사이트를 방문할 때, 서버는 쿠키를 생성하여 브라우저로 전송하고, 브라우저는 이를 로컬에 저장합니다. 이후 같은 웹사이트에 재방문할 때, 브라우저는 저장된 쿠키를 서버로 다시 전송합니다.
쿠키의 구조
Set-Cookie: name=value; Domain=example.com; Path=/; Expires=Wed, 09 Jun 2021 10:18:14 GMT; Secure; HttpOnly; SameSite=Strict쿠키는 다음과 같은 구성 요소를 포함합니다:
- Name=Value: 쿠키의 이름과 값
- Domain: 쿠키가 유효한 도메인
- Path: 쿠키가 유효한 경로
- Expires/Max-Age: 쿠키의 만료 시간
- Secure: HTTPS 연결에서만 전송
- HttpOnly: JavaScript로 접근 불가
- SameSite: 크로스 사이트 요청 제어
쿠키의 역할
- 사용자 인증 정보 저장: 로그인 상태 유지
- 사용자 설정 저장: 언어, 테마 등 개인화 설정
- 장바구니 정보: 전자상거래에서 선택한 상품 정보
- 추적 및 분석: 사용자 행동 분석, 광고 타겟팅
- 세션 관리: 세션 ID 저장
세션(Session)과의 차이점
세션의 개념
세션은 서버 측에서 사용자의 상태 정보를 관리하는 메커니즘입니다. 사용자가 웹사이트에 접속하면 서버는 고유한 세션 ID를 생성하고, 이 ID를 쿠키를 통해 클라이언트에게 전송합니다. 실제 세션 데이터는 서버에 저장되며, 클라이언트는 세션 ID만을 가지고 있습니다.
쿠키 vs 세션 비교
| 구분 | 쿠키(Cookie) | 세션(Session) |
|---|---|---|
| 저장 위치 | 클라이언트(브라우저) | 서버 |
| 저장 용량 | 제한적 (4KB) | 서버 메모리에 따라 유동적 |
| 보안성 | 상대적으로 낮음 | 높음 |
| 속도 | 빠름 (로컬 저장) | 상대적으로 느림 (서버 요청) |
| 수명 | 설정된 만료 시간까지 | 브라우저 종료 시 또는 설정 시간 |
| 서버 부하 | 없음 | 있음 |
세션 동작 과정
sequenceDiagram
participant Client as 클라이언트
participant Server as 서버
Client->>Server: 1. 로그인 요청
Server->>Server: 2. 인증 처리
Server->>Server: 3. 세션 ID 생성
Server->>Client: 4. 세션 ID를 쿠키로 전송
Client->>Server: 5. 후속 요청 시 세션 ID 포함
Server->>Server: 6. 세션 ID로 사용자 정보 조회
Server->>Client: 7. 응답 전송쿠키 보안 옵션 상세 분석
Secure 옵션
// HTTPS 환경에서만 쿠키 전송
document.cookie = "sessionId=abc123; Secure";- 역할: HTTPS 연결에서만 쿠키를 전송하도록 제한
- 보안 효과: 중간자 공격(Man-in-the-Middle)으로부터 쿠키 보호
- 주의사항: HTTP 환경에서는 쿠키가 설정되지 않음
HttpOnly 옵션
// 서버에서 설정 (클라이언트 JavaScript로는 설정 불가)
// Node.js Express 예시
res.cookie('sessionId', 'abc123', { httpOnly: true });- 역할: JavaScript를 통한 쿠키 접근을 차단
- 보안 효과: XSS(Cross-Site Scripting) 공격으로부터 쿠키 보호
- 제한사항:
document.cookie로 읽기/쓰기 불가
SameSite 옵션
SameSite 옵션은 세 가지 값을 가질 수 있습니다:
1. Strict (가장 엄격)
document.cookie = "sessionId=abc123; SameSite=Strict";- 다른 사이트에서 오는 모든 요청에서 쿠키 전송 차단
- CSRF 공격에 대한 강력한 보호
- 사용자 경험에 영향을 줄 수 있음 (외부 링크 클릭 시 로그아웃 상태)
2. Lax (기본값)
document.cookie = "sessionId=abc123; SameSite=Lax";- 일부 크로스 사이트 요청에서만 쿠키 전송 허용
- GET 요청과 같은 "안전한" 요청에서는 전송
- 균형잡힌 보안과 사용성 제공
3. None (제한 없음)
document.cookie = "sessionId=abc123; SameSite=None; Secure";- 모든 크로스 사이트 요청에서 쿠키 전송
- Secure 옵션과 함께 사용해야 함
- 서드파티 쿠키가 필요한 경우 사용
결론
쿠키와 세션은 웹 애플리케이션에서 사용자 상태 관리의 핵심 요소입니다. 각각의 특성을 이해하고 적절한 보안 옵션을 적용하는 것이 중요합니다. 특히 Secure, HttpOnly, SameSite 옵션을 통해 XSS와 CSRF 공격으로부터 애플리케이션을 보호할 수 있습니다.
현대 웹 개발에서는 보안과 사용자 경험의 균형을 맞추면서, 개인정보 보호 규정을 준수하는 것이 필수적입니다. 앞으로도 브라우저의 보안 정책 변화를 주시하며, 최신 베스트 프랙티스를 지속적으로 적용해야 할 것입니다.
