프론트엔드 개발자가 반드시 알아야 할 쿠키(Cookie)의 모든 것

💡이 글에서 소개하는 내용 1. 쿠키의 개요 2. 쿠키의 속성 3. 쿠키의 활용 예시 4. 쿠키와 세션의 차이

1. 쿠키의 개요

• 쿠키는 웹 브라우저가 웹 사이트로부터 전송받은 작은 데이터 조각으로, 일정 기간 동안 유효하며, 동일한 도메인과 서브도메인 간에 공유됩니다.
• 쿠키는 일반적으로 웹 서버에서 생성되며, 이름, 값, 도메인, 경로, 만료일, 보안 등의 속성이 있습니다.

2. 쿠키의 속성

• 쿠키는 이름, 값, 도메인, 경로, 만료일, 보안 등의 속성이 있습니다.
• 쿠키는 브라우저가 서버로 요청을 보낼 때마다 서버로 전송됩니다.
• 쿠키는 브라우저마다 저장되며, 사용자가 다른 브라우저를 사용하거나, 쿠키를 삭제하면 쿠키 데이터도 삭제됩니다.
• 쿠키는 동일한 도메인과 서브도메인 간에 공유됩니다. 따라서, 웹 사이트에서 여러 서브도메인을 사용하는 경우, 도메인 또는 서브도메인을 명시하여 쿠키를 구분해야 합니다.
• 쿠키는 기본적으로 클라이언트 사이드에 저장되므로, 보안상 중요한 데이터(예: 암호화된 비밀번호)는 저장해서는 안 됩니다.

3. 쿠키의 활용 예시

• 로그인 유지: 사용자가 로그인한 후, 웹 사이트는 사용자의 로그인 상태를 쿠키에 저장하여, 사용자가 다른 페이지로 이동하거나 브라우저를 닫아도 로그인 상태를 유지할 수 있습니다.
• 사용자 설정 유지: 사용자가 웹 사이트에서 선택한 언어, 테마, 폰트 등의 설정은 쿠키에 저장하여, 사용자가 페이지를 방문할 때마다 설정이 자동으로 적용됩니다.
• 광고 타켓팅: 웹 사이트는 사용자가 방문한 페이지와 검색어를 쿠키에 저장하여, 해당 사용자에게 적합한 광고를 보여줄 수 있습니다.
• 장바구니: 웹 사이트에서 사용자가 선택한 상품은 쿠키에 저장하여, 사용자가 다른 페이지로 이동하거나 브라우저를 닫아도 상품을 장바구니에 보존할 수 있습니다.
• 세션 관리: 웹 사이트는 세션 ID를 쿠키에 저장하여, 사용자의 세션을 추적하고, 사용자가 로그아웃하거나 일정 시간 동안 액션이 없을 경우 세션을 종료할 수 있습니다.

4. 쿠키와 세션의 차이

	쿠키	세션
저장위치	클라이언트	서버
보안	중요한 정보는 저장해서는 안됨	중요한 정보를 저장해도 됨
만료	브라우저에 저장되며 만료일이 지나면 삭제됨	일정시간 또는 사용자가 로그아웃하면 삭제됨
사용	주로 로그인 상태 유지, 사용자 추적, 개인화 등	주로 로그인 상태 유지, 사용자 추적, 개인화 등
저장량	작음	대용량 저장 가능
성능	요청시마다 서버로 전송되어 네트워크 부하 발생	서버에 저장되기 때문에 요청시마다 전송되지 않음
확장성	다른 도메인에서 공유 불가능	다른 도메인에서도 공유 가능

 

✅요점 정리 쿠키는 기본적으로 클라이언트 사이드에 저장되므로, 보안상 중요한 데이터(예: 암호화된 비밀번호)는 저장해서는 안 됩니다. 쿠키는 브라우저마다 저장되며, 사용자가 다른 브라우저를 사용하거나, 쿠키를 삭제하면 쿠키 데이터도 삭제됩니다. 쿠키는 일정 기간 동안 유효합니다. 만료일을 지정하여 쿠키가 언제까지 유효한지를 정할 수 있습니다. 쿠키는 동일한 도메인과 서브도메인 간에 공유됩니다. 따라서, 웹 사이트에서 여러 서브도메인을 사용하는 경우, 도메인 또는 서브도메인을 명시하여 쿠키를 구분해야 합니다. 쿠키는 일반적으로 웹 서버에서 생성하며, 브라우저는 서버로부터 받은 쿠키를 저장합니다. 따라서, 서버에서 생성한 쿠키를 수정하려면 서버 측에서 응답 헤더를 사용하여 새로운 쿠키를 보내야 합니다. 쿠키에는 이름, 값, 도메인, 경로, 만료일, 보안 등의 속성이 있습니다. 이러한 속성을 설정하여 쿠키를 좀 더 유연하게 사용할 수 있습니다. 쿠키는 브라우저가 서버로 요청을 보낼 때마다 서버로 전송됩니다. 따라서, 네트워크 트래픽을 늘리는 원인이 될 수 있습니다. 쿠키 사용을 최소화하거나, 필요한 경우에만 사용해야 합니다. 쿠키는 GDPR(일반 데이터 보호 규정) 및 개인정보 보호법과 같은 법적 규제에 따라 처리되어야 합니다. 개인정보를 수집하거나, 사용자 동의 없이 쿠키를 사용하는 것은 법적으로 문제가 될 수 있습니다.