들어가며
'쿠키(Cookie)'라는 단어를 들으면 뭐가 떠오르시나요? 바삭바삭한 과자? 아쉽게도 오늘 알아볼 쿠키는 과자가 아니라 웹사이트에서 사용되는 쿠키입니다. 대체 이 쿠키가 무엇이고 왜 필요한 지 궁금한 적 없으셨나요? 이번 시간에는 바로 그 쿠키에 대해서 알아보도록 하겠습니다.
쿠키가 뭐지?
"쿠키"라는 이름은 "매직 쿠키"라는 용어에서 유래되었습니다. 매직 쿠키는 컴퓨터 프로그램이나 시스템 간에 전달되는 정보의 일부로, 특정 목적을 위해 사용되는 데이터를 가리키는데요.
웹에서의 쿠키(HTTP cookie, web cookie, browser cookie, cookie)도 이와 비슷한 개념으로, 서버가 클라이언트(대개 웹 브라우저)에 전송하는 작은 데이터 파일입니다. HTTP는 stateless(상태 정보를 유지하지 않는) 프로토콜이므로, 상태 정보를 유지하기 위한 별도의 메커니즘이 필요한데요. 이 때 사용될 수 있는 방법 중 하나가 바로 쿠키입니다.
웹 서버는 HTTP 응답 헤더의 'Set-Cookie' 필드를 통해 쿠키를 클라이언트에게 전송합니다. 클라이언트는 이 쿠키를 저장하고, 이후 같은 서버로 요청을 보낼 때마다 'Cookie' HTTP 요청 헤더에 저장된 쿠키를 포함시켜 보냅니다. 이렇게 함으로써, 서버는 클라이언트를 식별하고 이전 상태 정보를 유지할 수 있습니다.
언제 사용할까?
쿠키는 주로 세 가지 목적으로 사용됩니다.
- 세션 관리(Session management)
서버에 저장해야 할 로그인, 장바구니, 게임 스코어 등의 정보 관리 - 개인화(Personalization)
사용자 선호, 테마 등의 세팅 - 트래킹(Tracking)
사용자 행동을 기록하고 분석하는 용도
예시를 하나 들어볼까요?
사용자가 웹사이트에 처음 방문했을 때 언어를 선택하면 이 정보가 쿠키에 저장됩니다. 이후 사용자가 같은 웹사이트를 방문하면 동일한 언어 환경이 유지됩니다.
쿠키도 마냥 좋은 건 아니다
쿠키는 편리하기 하지만 아래와 같은 단점을 지니고 있습니다.
- 용량 제한
대부분의 브라우저에서 쿠키의 크기는 4KB 정도로 작기 때문에, 많은 데이터를 저장할 수 없습니다. - 성능 문제
쿠키는 모든 HTTP 요청과 함께 전송되기 때문에, 많은 양의 쿠키가 있으면 성능에 문제가 될 수 있습니다. - 보안 이슈
쿠키는 클라이언트(주로 브라우저)에 저장되므로, 쿠키를 탈취하거나 조작하는 공격에 취약할 수 있습니다.
보안 이슈
민감하거나 중요한 정보는 쿠키에 저장되지 않아야 합니다.
- 세션 하이재킹(Session Hijacking)
쿠키는 대개 웹 애플리케이션에서 사용자와 그들의 인증된 세션을 식별하기 위해 사용되곤 하는데요. 따라서 쿠키를 가로채는 것은 인증된 사용자의 세션 하이재킹으로 이어질 수 있습니다. 쿠키를 가로채는 일반적인 방법으로는 크로스 사이트 스크립팅(Cross-site scripting, XSS)이 있습니다. XSS 공격은 공격자가 웹 사이트에 악성 스크립트를 삽입하여 사용자의 브라우저를 공격하는 방법입니다. - 크로스 사이트 요청 위조(Cross-Site Request Forgery, CSRF)
CSRF 공격은 사용자가 자신의 의지와는 무관하게 공격자가 의도한 행동을 실행하도록 만드는 공격입니다. 사용자의 쿠키가 자동으로 요청에 포함되기 때문에, 공격자는 사용자가 로그인한 상태에서 공격자가 원하는 요청을 보낼 수 있습니다.
이런 이슈를 해결하기 위해 다음과 같은 방법을 사용할 수 있습니다.
- 쿠키에 'Secure' 플래그를 설정하여 HTTPS를 통해서만 쿠키가 전송되도록 할 수 있습니다. 이렇게 하면 네트워크 상에서 쿠키가 노출되는 것을 방지할 수 있습니다.
- 'HttpOnly' 플래그를 설정하여 자바스크립트 등의 클라이언트 측 스크립트에서 쿠키에 접근하는 것을 막을 수 있습니다. 이렇게 하면 XSS 공격을 막는데 도움이 될 수 있습니다.
- 쿠키의 수명을 짧게 설정하고, SameSite 플래그를 'Strict'나 'Lax'로 설정하여 다른 사이트에서의 요청에 쿠키를 포함하지 않도록 할 수 있습니다. 이렇게 하면 CSRF 공격을 막는데 도움이 될 수 있습니다.
쿠키의 대안
쿠키 외에도 클라이언트 측에서 사용할 수 있는 데이터 저장 방법은 여러 가지가 있습니다.
- 로컬 스토리지(Local Storage)
로컬 스토리지는 사용자가 브라우저를 닫거나 컴퓨터를 재부팅해도 데이터가 유지되는 영구 저장소입니다. 로컬 스토리지는 쿠키와 달리 용량 제한이 크고 (일반적으로 5MB 이상), HTTP 요청에 자동으로 포함되지 않아 네트워크 효율성이 더 좋습니다. - 세션 스토리지(Session Storage)
세션 스토리지는 로컬 스토리지와 유사하지만 사용자가 브라우저 탭 또는 브라우저 창을 닫으면 세션 스토리지의 데이터도 함께 사라지는 임시 저장소입니다. 각 브라우저 탭마다 고유한 세션 스토리지를 갖습니다. - 인덱스드 DB(IndexedDB)
인덱스드 DB는 브라우저에서 제공하는 NoSQL DB입니다. 이는 복잡한 웹 애플리케이션에서 대량의 구조화된 데이터를 클라이언트 측에 저장하고, 비동기적으로 검색하고 조작할 수 있게 해 줍니다. 인덱스드 DB는 트랜잭션을 지원하며, 키-값 저장 시스템을 기반으로 하고 있습니다.
마치며
지금까지 HTTP 쿠키에 대해서 알아봤는데요. 쿠키는 클라이언트에 사용자의 정보를 저장하기 위한 방법입니다. 가장 먼저 나온 저장 방법으로 아직까지 널리 사용되고 있지만 여러 문제들, 특히 보안과 관련된 이슈를 조심해야 합니다. 가능하다면 쿠키 대신 다른 저장 방법들을 사용하는 게 권장된다고 하니 잘 살펴보시고 적절한 방법을 선택하시면 되겠습니다.
지적이나 다른 의견은 언제나 환영합니다 :D
감사합니다.
See also
https://developer.mozilla.org/en-US/docs/Glossary/Cross-site_scripting
https://developer.mozilla.org/en-US/docs/Glossary/CSRF
https://yepchani.tistory.com/entry/HTTP에-대해-알아보자
https://yepchani.tistory.com/entry/HTTP-세션-이해하기
References
'Web' 카테고리의 다른 글
| 웹 스토리지 이해하기 (0) | 2024.03.05 |
|---|---|
| HTTP 세션 이해하기 (0) | 2024.02.20 |
| REST API? 그게 뭔가요? (0) | 2024.02.06 |
| HTTP에 대해 알아보자 (1) | 2024.01.30 |
| 웹 페이지 렌더링 방식: CSR, SSR, SSG 이해하기 (2) | 2023.11.20 |