Cookie 쿠키

#개발용어 #web

개요

[!note]
Cookie는 웹사이트를 방문할 때 사용자의 컴퓨터에 저장되는 작은 텍스트 파일이야.
쉽게 말해, 브라우저가 사용자의 정보를 저장하는 작은 메모리 조각이지

쿠키의 필요성

[!note]
쿠키가 필요한 이유는, HTTP의 무상태성 Statelessness 때문이다.

서버는 매 요청을 새로운 요청으로 간주해서, 네가 방금 전에 로그인을 했는지, 아니면 어떤 페이지를 봤는지 전혀 기억하지 못해. 만약 무상태성만 있다면, 다음 페이지로 넘어갈 때마다 "네가 김유진이야?"라고 다시 물어봐야 하는 문제가 생기지.

이때 쿠키가 등장해. 서버는 로그인에 성공한 사용자에게 '너는 김유진이다' 라는 정보가 담긴 쿠키를 넘겨줘. 브라우저는 이 쿠키를 저장했다가, 같은 서버에 요청을 보낼 때마다 이 '신분증' 을 함께 보내줘. 덕분에 서버는 매번 로그인 정보를 받지 않아도 사용자를 식별할 수 있는 거야.

주로 다음과 같은 용도로 사용돼.

• 로그인 상태 유지: 한 번 로그인하면 다시 로그인할 필요가 없도록.
• 개인 맞춤 설정: "오늘 다시 보지 않기" 같은 옵션을 저장.
• 장바구니 기능: 로그인하지 않아도 장바구니에 상품을 담아둘 수 있도록.
• 트래킹 기능: 사용자의 행동을 기록하고 분석하는 용도

쿠키 종류

1. 세션 쿠키 Session Cookie
   • 사용자가 브라우저를 사용하는 동안만 유효함.
   • 브라우저는 사용자가 브라우저를 사용하는 동안 Cookie 정보를 서버로 전달.
   • Expires , Max-Age [^1] 를 설정안함
2. 지속 쿠키 Persistent Cookie
   • 사용자가 브라우저를 종료하더라도 유지되는 쿠키
   • Expires 혹은 Max-Age 가 같이 설정되는 쿠키

쿠키 속성

SESSION=61f39beb-0a39-4705-8f8e-8738caf6a162; Domain=.dooray.com; Path=/; Secure; HttpOnly; SameSite=None

• Name : 세션 키 이름
• Value : 세션 값
• Domain : 어느 도메인에서 쿠키를 사용할 수 있는지 지정
• Path : 어느 경로에서 쿠키를 사용할 수 있는지 지정

Set-Cookie: cart=items; Path=/shop
→ /shop, /shop/cart, /shop/payment에서 사용 가능
→ /profile에서는 사용 불가

Set-Cookie: session=abc; Path=/
→ 모든 경로에서 사용 가능

• Expaires / Max-Age : 쿠키의 유효(만료)기간[^2]

Set-Cookie: session=data; Expires=Wed, 31 Jul 2025 23:59:59 GMT
Set-Cookie: session=abc; Max-Age=3600  (1시간 후 만료)
Set-Cookie: remember=yes  (브라우저 종료시 삭제)

• HttpOnly
  • 보안을 위해 사용 (XSS 공격 방지)
  • JavaScrip 에서 쿠키에 접근 불가능하게 만듦
• SameSite
  • 크로스 사이트(다른 도메인) 요청에서 쿠키 포함여부를 결정

참조

https://developer.mozilla.org/ko/docs/Web/HTTP/Guides/Cookies

[^1]: 만료 시간을 의미
[^2]: Expires는 정확한 날짜를, Max-Age는 남은 시간을 지정함