[Network] 쿠키 (Cookie)

💡 HTTP는 무상태 (Stateless) 프로토콜

• 요청과 응답을 주고 받으면 연결이 끊어짐
• 재 요청시 서버는 이전 요청을 기억하지 못 함
• 클라이언트와 서버는 서로 상태를 유지하지 않음

이것을 쿠키로 보완

---

🍪 쿠키란 ...

내가 만든 쿠키~ .. 너를 위해 구웠지 ..

• 서버가 사용자의 웹 브라우저에 전송하는 작은 데이터 조각
• 브라우저는 그 데이터 조각들을 저장해 놓았다가, 동일한 서버에 재 요청 시 저장된 데이터를 함께 전송
• 모든 요청에 쿠키 정보 자동 포함

---

• 사용처

  • 사용자 로그인 세션 관리
  • 광고 정보 트래킹

• 쿠키 정보는 항상 서버에 전송됨

  • 네트워크 트래픽 추가 유발
  • 최소한의 정보만 사용 (세션 id, 인증 토큰)
  • 서버에 전송하지 않고, 웹 브라우저 내부에 데이터를 저장하고 싶으면 웹 스토리지 (localStorage, sessionStorage) 참고

• 주의
  - 보안에 민감한 데이터는 저장하면 안 됨 (주민번호, 신용카드 번호 등)

헤더 (Set-Cookie, Cookie)

• Set-Cookie

  • 서버에서 클라이언트로 쿠키 전달 (응답)

• Cookie

  • 클라이언트가 서버에서 받은 쿠키를 저장하고, HTTP 요청시 서버로 전달

1. 로그인
   

2. 로그인 이후 접근

Set-Cookie

set-cookie: sessionId=abcde1234; 
			expires=Sat, 26-Dec-2022 00:00:00 GMT; 
            Path=/; 
            domain=.google.com; 
            Secure

1) 생명주기

set-cookie: expires=Sat, 26-Dec-2022 00:00:00 GMT
set-cookie: max-age=3600 (3600초)

• expires : 만료일이 되면 쿠키 삭제
• max-age : 0이나 음수를 지정하면 쿠키 삭제

2) 종류

• 세션 쿠키 : 만료 날짜 생략 👉 브라우저 종료시까지만 유지
• 영속 쿠키 : 만료 날짜 입력 👉 해당 날짜까지 유지

3) 도메인 (Domain)

domain=example.org

• 명시

  • 명시한 문서 기준 도메인 + 서브 도메인 포함
  • domain=example.org 지정하여 쿠키 생성시
    👉 example.org + dev.example.org 쿠키 접근

• 생략

  • 현재 문서 기준 도메인만 적용
  • example.org 에서 쿠키를 생성하고 지정 생략시
    👉 example.org만 쿠키 접근,
    dev.example.org는 쿠키 미접근

4) 경로 (Path)

도메인으로 1차 필터링 => 경로로 추가 필터링

• 경로를 포함한 하위 경로 페이지만 쿠키 접근
• 일반적으로 path=/ 루트로 지정

ex) path=/home 지정시

	/home
    /home/lever1
    /home/lever1/level2  👉 가능
    
    /hello 👉 불가능 

5) 보안

• Secure

  • 쿠키는 http, https 를 구분하지 않고 전송
  • Secure를 적용하면 https인 경우에만 전송

• HttpOnly

  • XSS 공격 방지
  • 자바스크립트에서 접근 불가 (document.cookie)
  • HTTP 전송에만 사용 가능

• SameSite

  • XSRF 공격 방지
  • 요청 도메인과 쿠키에 설정된 도메인이 같은 경우만 쿠키 전송