🍪 Cookie란?
- 사용자의 웹 브라우저에 저장되는 작은 데이터 조각
→ 사용자 상태 유지, 로그인 정보 저장, 사용자 경험 개선 등에 사용
❓ 왜 Cookie가 필요할까?
| 이유 | 설명 |
|---|---|
| ⚠️ HTTP는 Stateless, Connectionless | 서버는 매 요청이 새로운 요청이라 생각함 (기억력이 없음) |
| 🔁 로그인 상태 유지 필요 | 로그인한 사용자가 다시 요청해도 로그인 상태 유지해야 함 |
| 💾 사용자 정보 저장 필요 | 로그인 후에도 브라우저가 사용자 정보를 기억해야 함 |
🔍 Cookie 확인 방법
- F12 → Application → Cookies 탭
- 웹사이트에 저장된 쿠키 목록을 볼 수 있음
📌 단순 저장만 원한다면?
→ localStorage, sessionStorage 사용도 가능 (보안 주의)
✅ 로그인 과정과 Cookie의 역할
🔐 로그인 성공 시
- 서버가 응답에
Set-Cookie헤더 포함 → 브라우저가 쿠키 저장
Set-Cookie: sessionId=abcd1234;📡 로그인 후 요청 시
- 브라우저가 자동으로
Cookie헤더에 쿠키 담아 전송
Cookie: sessionId=abcd1234⚠️ 주의
- 모든 요청마다 쿠키 전송 = 네트워크 트래픽 증가
- 최소한의 정보만 저장해야 함 (ex.
sessionId,token등)
📬 Cookie Header 구조
- 서버에서는 HTTP 응답 헤더에
Set-Cookie속성을 사용해 생성하고 설정할 수 있음
📤 응답(Response)
Set-Cookie: name=value; expires=...; path=/; domain=...; Secure; HttpOnly📥 요청(Request)
Cookie: name=value🧬 Cookie의 주요 속성들
| 종류 | 설명 |
|---|---|
| 🧊 Session Cookie(세션 Cookie) | 브라우저 종료 시 삭제됨 (기본값) |
| 🔁 Persistent Cookie(영속 Cookie) | expires 또는 max-age로 유효 기간 지정 가능max-age=3600 → 1시간 |
🌐 Cookie의 도메인 (Domain)
domain=spartacodingclub.kr
→ 이 도메인 또는 하위 도메인에서만 사용 가능
→ 아무 사이트에서나 생긴다면 필요없는 값 전송, 트래픽 문제 등이 발생- 생략 시: 현재 페이지 도메인만 허용
🛤️ Cookie의 경로 (Path)
- 1차적으로 도메인으로 필터링 후 Path가 적용됨
-path=/: 전체 경로에서 쿠키 접근 가능
-path=/api:/api하위 경로에서만 접근 가능
| 🔐 Cookie 보안 설정 | 옵션 |
|---|---|
| 🔒 Secure | HTTPS에서만 쿠키 전송 가능 (HTTP는 ❌) |
| 🚫 HttpOnly | 자바스크립트에서 쿠키 접근 불가 → XSS 공격 방지 |
| 🛡️ SameSite | CSRF 공격 방지 동일한 도메인에서만 쿠키 전송 허용 |
🧠 요약 정리
-
HTTP는 상태를 기억 못하므로 로그인 상태 유지를 위해 쿠키 사용
-
쿠키는 브라우저에 저장되고, 서버에 요청할 때마다 자동으로 포함되어 전송됨
-
Set-Cookie,Cookie헤더로 서버와 클라이언트 간 쿠키 교환 -
보안 설정(
Secure,HttpOnly,SameSite)은 필수 -
민감 정보는 절대 쿠키에 직접 저장하지 말 것
