[네트워크] 사용자와 서버 간의 상호작용 쿠키

1. 쿠키

1) 쿠키 개념

이전의 포스팅에서 HTTP 서버는 상태를 유지하지 않는다고 했습니다.

그러나 서버가 사용자 접속을 제한하거나 사용자에 따라 콘텐츠를 제공할때 사용자를 확인하고 싶은 경우가 생길 수 있습니다.

이럴때 HTTP는 쿠키(cookie)를 사용합니다.

쿠키(cookie): 서버가 사용자를 식별하고 상태를 유지하기 위해 브라우저에 저장하는 작은 데이터

쿠키 기술은 다음과 같은 네가지 요소를 가지고 있습니다.

1. HTTP 응답의 Set-Cookie: 서버가 쿠키를 발급, 갱신
2. HTTP 요청의 Cookie: 브라우저가 저장해둔 쿠키를 자동 전송
3. 사용자 브라우저의 쿠키 저장소: 도메인/경로/만료 규칙에 따라 보관
4. 웹사이트의 백엔드(back-end) 데이터베이스: 쿠키 ID <-> 사용자 상태 매핑

위 네가지 요소를 통해 쿠키는 사용자의 브라우저에 저장되고 서버와의 응답, 요청 메시지에 포함된다는 것을 알 수 있습니다.

쿠키는 도메인/경로/만료/보안 속성으로 동작 범위가 정해집니다.

• Domain, Path: 어느 요청에 실릴지 범위 결정
• Expires/Max-Age: 세션쿠키 vs 지속 쿠키
• Secure: HTTPS에서만 전송
• HttpOnly: JS에서 접근 불가
  -> 오직 Http 통신에만 사용하고 JS에서는 못 건드리게 방지
  -> XSS(스크립트 삽입) 공격에서 document.cookie로 쿠키 정보를 탈취하는 것을 방지
• SameSite
  -> SameSite=Lax(기본값): 다른사이트에서 들어오는 GET요청에는 쿠키가 안붙음
  -> SameSite=Strict: 오직 같은 사이트에서만 쿠키 전송
  -> SameSite=None: 크로스사이트 요청에서도 쿠키 전송 허용(주로 제3자 로그인에서 사용)

이러한 쿠키는 도메인별로 분리되며 다른 도메인의 쿠키는 공유되지 않습니다.

쿠키의 간단한 예시는 다음과 같습니다.

Set-Cookie: sessionId=1678; Path=/; HttpOnly; Secure; SameSite=Lax
# 이후 요청 Cookie: sessionId=1678

 

2) 쿠키 동작

 

사용자가 브라우저를 통해 처음으로 amazon.com에 접속한다고 가정해봅시다.

아마존 웹서버에 요청이 들어오면 서버는 유일한 식별번호(1678)을 생성하고 저장합니다.

응답할때 서버는 식별번호가 포함된 Set-cookie 헤더를 응답에 포함합니다.

사용자가 아마존 사이트를 살펴봄에 따라 서버는 식별번호와 관련된 데이터들을 생성하고 저장할 것입니다.

이처럼 쿠키를 통해 서버는 사용자를 식별하고 사용자에게 맞춤형 정보를 제공할 수 있습니다.

 

3) 쿠키 활용

쿠키는 단순히 사용자를 기억하는 데이터를 넘어서 웹서비스 전반에서 여러 방식으로 활용됩니다.

간단하게 예시를 들어보겠습니다.

• 세션 관리(Session Management)
  • 로그인 상태 유지: 사용자가 로그인하면 서버는 세션 ID를 쿠키로 발급하고, 이후 요청마다 쿠키가 함께 전송되어 인증된 상태를 유지
  • 장바구니 기능: 쇼핑몰 사이트에서 상품을 담아두면, 쿠키의 식별자를 통해 서버 DB의 장바구니 데이터를조회하여 사용자가 페이지를 옮겨도 장바구니가 유지됨
• 개인화(Personaliztion)
  • 사용자의 설정 정보(언어, 테마, 글꼴 크기 등)를 쿠키에 저장, 다음 방문시에도 동일한 환경으로 접속
  • 방문 기록, 관심사를 기반으로 맞춤형 콘텐츠를 제공
• 트래킹 및 분석(Tracking & Analytics)
  • 사용자의 웹사이트 방문 기록을 기반으로 행동을 분석
  • 광고사에서 제3자 쿠키(Third-party cookie)를 사용하면 여러 사이트에서 동일 사용자를 추적하여 맞춤형 광고 제공 가능
• 보안 관련(Security)
  • HttpOnly, Secure, SameSite 옵션을 사용하여 XSS/CSRF같은 공격을 완화
  • JWT 토큰을 쿠키에 저장하여 인증 수단으로 사용

크로스사이트(Cross-site): 현재 사용자가 보고있는 사이트와 다른 사이트간의 상호작용

XSS(Cross-Site Scripting): 공격자가 웹페이지에 악성 스크립트를 심어 사용자의 브라우저에서 실행되게 하는 공격

CSRF(Cross-Site Request Forgery): 사용자가 로그인한 상태를 악용해 원하지 않는 요청을 사용자의 권한으로 서버에 보내게 하는 공격

제 3자 쿠키는 현재 보고 있는 사이트와는 다른 도메인에서 발급된 쿠키로 외부 도메인의 리소스(이미지, 광고, 통계 스크립트 등)을 끌어오는데 사용됩니다. 현재는 SameSite 옵션이 Lax로 바뀌면서, 크로스사이트 요청에서는 쿠키가 자동으로 붙지 않게 됐습니다.

이는 쿠키가 사용자의 경험을 간소화하지만 사생활 침해로 이어질 수 있다는 관점에 대한 예시가 됩니다.