블로그

웹이 우리를 기억하는 방법, 쿠키

웹사이트는 생각보다 우리를 잘 기억합니다. 어제 장바구니에 담아둔 상품이 그대로 남아 있거나, 며칠 전 로그인했던 상태가 여전히 유지되는 것을 경험해 보셨을 거에요. 하지만 원래 인터넷을 이루는 HTTP는 이런 기억력이 없습니다. 무상태(stateless), "기억하지 못하는" 특성을 지니고 있기 때문이에요. HTTP의 무상태성클라이언트가 서버에 요청을 보낸 뒤에 다시 요청을 보내도, 서버는 같은 사용자인지 전혀 알 수 없습니다. 요청 메시지 안에 클라이언를 식별할 정보가 없으니까요.무상태성 덕분에 서버는 비교적 단순하게 동작할 수 있고, 여러 대의 서버로 쉽게 확장할 수 있습니다. 요청 하나하나가 독립적이므로 어느 서버가 응답하든 상관없기 때문이죠.하지만 현실의 웹 애플리케이션은 사용자를 기억해야 할 필요가 많습니다."다시 방문한 사용자"를 식별해야 하고,로그인 상태를 유지해야 하며,사용자가 담아둔 장바구니 물건도 알고 있어야합니다. 여기서 탄생한 것이 바로 쿠키(cookie)입니다. 탄생 배경쿠키라는 개념은 1990년대 초반, 온라인 쇼핑 카트 기능을 구현하기 위해 고안되었습니다. 당시 네스케이스 개발자가 제안한 방식이 그 시초입니다. 사이트 재 방문 확인 기능이 이를 활용한 첫 사례라고 합니다.재밌는 점은 유닉스 세계에 이미 비슷한 개념이 있었다는 것입니다. 특정한 값을 건네주고 나중에 돌려받는 방식이었는데, 이를 매직 쿠키(magic cookie)라고 불렀습니다. 마치 놀이공원 입구에서 손목에 도장을 찍어주는 것과 같죠. 기본 동작핵심은 단순합니다. 서버와 브라우져가 상태를 주고 받을 수 있도록 HTTP 헤더를 활용하는 것입니다.서버 응답: 서버는 브라우져에게 특정 값을 기억하라고 응답 헤더를 통해 지시합니다. (일종의 도장)브라우져 저장: 브라우져는 이를 쿠키 저장소에 기록합니다. (도장을 손목에 찍음)브라우져 요청: 이후 자동으로 쿠키를 요청 헤더에 실어 보냅니다. (재입장할 때 도장을 보여줌)서버는 이 값을 확인하고 "다시 방문한 사용자"라고 판단할 수 있습니다. 속성쿠키는 단순한 문자열 이상의 기능을 제공합니다.Domain: 어떤 도메인에 이 쿠키를 보낼지 제한합니다. (예: example.com에 설정된 쿠키를 sub.example.com에서도 쓸 수 있음)Path: 특정 경로에서만 쿠키가 전송되도록 제한합니다. (예: /shop에 설정된 쿠키를 /blog 요청에는 미설정 할 수 있음)Max-Age / Expires: 쿠키의 수명을 정합니다. 세션 쿠키(브라우져 종료 시 삭제)와 영속 쿠키(일정 기간 유지)로 나뉘게 되죠.Secure: HTTPS 요청에만 쿠키를 전송하도록 제한합니다. (암호화되지 않은 HTTP에서 숨기기 위한 안전장치)HttpOnly: 자바스크립트 코드에서 쿠키를 읽지 못하게 합니다. (크로스사이트 스크립트(XSS) 공격으로부터 세션 쿠키를 보호)이러한 속성 덕분에 쿠키는 단순한 "메모장"을 넘어 범위, 유효기간, 보안 등을 정밀하게 제어할 수 있답니다. 활용 사례우리는 웹에서는 쿠키를 매우 다양한 방식으로 사용할 수 있습니다.로그인 세션 유지: 사용자가 아이디와 비밀번호로 로그인하면, 서버는 세션을 만들고 세션 ID를 쿠키로 응답합니다. 이후 요청마다 이 세션 ID가 서버로 함께 전송되어 로그인 상태를 유지할 수 있습니다.개인화된 서비스: 사용자가 선호하는 언어, 최근 본 상품 목록 등을 쿠키에 기록해 두고, 다음 방문 때 동일한 환경을 제공할 수 있습니다.광고 트래킹: 광고 네트워크는 쿠키를 활용해 사용자의 웹 활동을 추적하고 맞춤형 광고를 제공합니다. 한계와 대안물론 단점도 있습니다.용량이 제한적입니다. (보통 하나의 쿠키는 4KB, 도메인별 20개 정도 제한)매 요청마다 자동으로 전송되므로 네트워크 트래픽이 늘어납니다.보안에 민감한 값은 쿠키에 저장하지 않아야 합니다. (예: 개인정보)쿠키 대안으로 세션 스토리지, 로컬 스토리지, 토큰 기반 인증(JWT) 등이 사용됩니다. 하지만 여전히 "서버와 클라이언트 간의 신뢰할 수 있는 연결 고리"로써 쿠키는 가장 클래식하고 널리 쓰이는 방식입니다. 결론쿠키는 단순히 브라우져 저장소 중 하나가 아닙니다. HTTP라는 무상태 프로토콜 위에서 "사용자를 기억하기" 위해 탄생한 역사적 맥락과, 서버와 클라이언트가 헤더를 주고받는 과정 속에서 이해할 때 비로소 제대로 된 그림이 보일 것입니다.이 글은 제가 준비한 강의 「웹 개발의 핵심, HTTP 완벽 가이드」 의 2편을 바탕으로 작성하였습니다. 쿠키에 국한되지 않고, HTTP의 기본 구조부터 브라우저 동작 원리, AJAX, 보안, 성능까지 폭넓게 다루고 있습니다. 조금 더 깊이 있는 내용을 원하신다면 강의와 함께 따라오셔도 좋습니다.이 강의에서 다루는 내용1편. HTTP 기본2편. 브라우져3편. AJAX4편. 추가 프로토콜5편. 보안6편. 성능