[웹 서비스]HTTP 쿠키

쿠키란?

• 서버가 사용자의 웹 브라우저에 전송하는 작은 데이터 조각이다.
• 브라우저는 그 데이터 조각들을 저장해 놓았다가, 동일한 서버에 재 요청 시 저장된 데이터를 함께 전송한다.
• 서버는 브라우저 요청과 쿠키의 전송이 동일한 브라우저에서 들어왔는지 아닌지를 판단한다.
• 상태가 없는(stateless) HTTP 프로토콜에서 상태 정보를 기억시키는 역할을 하여, 사용자의 로그인 상태를 유지할 수 있다.

 

※상태가 없는(stateless)

: 브라우저가 서버에 HTTP 프로토콜을 통해 요청시, 응답과 동시에 해당 정보는 폐기되는 것. 예를 들어 브라우저가 서버에게 "오늘 저녁 삼겹살 어때?"라고 묻는다면, "좋아."라고 답할 것이다. 그 후 다음 요청으로 "몇시가 좋아?"라고 묻는다면 서버는 "그게 무슨 말이야?"라고 대답할 것이다. 이는 HTTP 프로토콜의 특징이다.

---

왜 쿠키를 쓸까?

• 세션 관리(Session management): 서버에 저장해야 할 로그인, 장바구니, 게임 스코어 등의 정보 관리
• 개인화(Personalization): 사용자 선호, 테마 등의 세팅
• 트래킹(Tracking): 사용자 행동을 기록하고 분석하는 용도

 

---

어떻게 쿠키가 사용될까?

서버가 HTTP 요청을 수신할 때, 응답과 함께 `Set-Cookie` 헤더를 전송한다.

Set-Cookie: <cookie-name>=<cookie-value> //쿠키 헤더의 기본 형식

HTTP/1.0 200 OK
Content-type: text/html
Set-Cookie: yummy_cookie=choco
Set-Cookie: tasty_cookie=strawberry

[page content]

브라우저는 Cookie 헤더를 사용하여, 이전에 서버에 저장했던 모든 쿠키를 회신한다.

GET /sample_page.html HTTP/1.1
Host: www.example.org
Cookie: yummy_cookie=choco; tasty_cookie=strawberry

위와 같이 기본적으로 쿠키를 사용한다. 다음으로는 적용할 수 있는 다양한 옵션을 살펴보자.

 

---

쿠키 옵션 모음

Set-Cookie: <cookie-name>=<cookie-value>
Set-Cookie: <cookie-name>=<cookie-value>; Expires=<date>
Set-Cookie: <cookie-name>=<cookie-value>; Max-Age=<non-zero-digit>
Set-Cookie: <cookie-name>=<cookie-value>; Domain=<domain-value>
Set-Cookie: <cookie-name>=<cookie-value>; Path=<path-value>
Set-Cookie: <cookie-name>=<cookie-value>; Secure
Set-Cookie: <cookie-name>=<cookie-value>; HttpOnly

Set-Cookie: <cookie-name>=<cookie-value>; SameSite=Strict
Set-Cookie: <cookie-name>=<cookie-value>; SameSite=Lax

// Multiple directives are also possible, for example:
Set-Cookie: <cookie-name>=<cookie-value>; Domain=<domain-value>; Secure; HttpOnly

• Expires=<dates>

Set-Cookie: id=a3fWa; Expires=Wed, 21 Oct 2015 07:28:00 GMT;

→ <dates>에 쿠키의 최대 유지 기간을 정한다. 이 기간이 끝나면 해당 쿠키는 파기된다. 

• Max-Age=<number>

→ 쿠키가 파기될 때 까지의 시간으로 초 단위로 작성한다.

• Domain=<domain-value>

→ 쿠키가 적용될 호스트 도메인 주소. 작성하지 않는다면 현재 문서 URI를 기준으로 적용된다.

• Path=<path-value>

→ 요청된 리소스에 있어야하는 URL 경로다.

• Secure

→ HTTPS 프로토콜을 사용할 때에만 전송된다. HTTP 프로토콜은 불가능하다. 그러나 쿠키에 중요한 정보를 저장하는 것은 바람직하지 않다. 누구나 다 쿠키로 서버에 요청한다면, 해당 사용자의 계정에 접속할 수 있는 매커니즘으로 보안이 결여되어 있다.

• HttpOnly

→ 해당 옵션을 true로 설정하면, 자바스크립트를 통해 쿠키에 접속하는 것을 막는다. 따라서 XSS와 같은 공격을 막을 수 있다. 이 공격은 다음에 배우겠다. 기본값은 false이다.

• SameSite
  • Lax :Cross-Origin 요청이면 'GET' 메소드에 대해서만 쿠키를 전송할 수 있다.
  • Strict : Cross-Origin이 아닌 same-site 인 경우에만 쿠키를 전송 할 수 있다.
  • None: 항상 쿠키를 보내줄 수 있다. 다만 쿠키 옵션 중 Secure 옵션이 필요한데, 이때 'same-site'는 요청을 보낸 Origin과 서버의 도메인이 같은 경우를 말한다.

 

---

참고

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

HTTP 쿠키 - HTTP | MDN

https://developer.mozilla.org/ko/docs/Web/HTTP/Headers/Set-Cookie

Set-Cookie - HTTP | MDN