[프론트엔드 개발자가 알아야 할 기초 지식] 쿠키(Cokie)와 세션(Session)

 

쿠키, 세션, 로컬 스토리지는 모두 웹 개발에서 사용되는 데이터 저장 및 상태 관리 기술이다. 

개발하는데 있어서 사용자 편의성를 제공하는데 유용한데, 어떤 상황에서 어떤 정보를 저장하는게 좋을까는 매번 고민이 된다.

 

 

웹은 기본적으로 상태를 유지하지 않는 프로토콜인 HTTP를 사용한다. 즉, 각각의 요청은 독립적으로 처리되고 서버는 클라이언트를 식별할 수 없는데, 이런상황에서 쿠키와 세션은 클라이언트와 서버 간의 상태를 유지하기 위해 사용됩니다.

 

쿠키(Cokie)

개념

• 사용자가 특정한 웹사이트에 방문할때, 사용자 컴퓨터에 저장하는 기록 파일이다.
• 클라이언트에 저장되는 작은 데이터 파일로, 클라이언트의 로컬에 저장됩니다. 쿠키는 클라이언트가 서버에 요청을 보낼 때마다 함께 전송되어 서버는 클라이언트를 식별하고 사용자별로 상태를 유지할 수 있다.

특징

• 서버의 자원을 전혀 사용하지 않는다. 

 

쿠키를 웹 개발에서 어떤 상황에서 사용할 수 있을까?

• 사용자 로그인 유지
  • 사용자가 로그인에 성공하면, 서버는 사용자의 식별 정보를 쿠키에 저장하고 사용자가 웹페이지를 요청할때 마다 해당 쿠키를 서버에 전송하여 사용자 인증하여 로그인 상태를 유지할 수 있음
• 장바구니 관리
  • 사용자가 상품을 장바구니에 추가하면 해당 상품 정보를 쿠키에 저장하고, 사용자가 다시 웹 사이트에 방문하면 서버는 쿠키를 읽어 사용자의 장바구니를 복원하여 이전에 선택한 상품을 표시 할 수 있다
• 개인화된 사용자 경험
  • 사용자가 웹 사이트의 언어 설정을 변경하면 해당 설정르 쿠키에 저장하여 사용자가 다시 웹사이트를 방문할 때 해당 언어로 표시할 수 있다.

 

---

세션(Session)

한명의 사용자(브라우저)의 상태를 유지하는 기술

특징

• 서버가 클라이언트에게 고유한 Seesion ID를 부여하면, 클라이언트는 접속할 때마다 Session ID와 함께 요청한다.
  • 서버에서 가지고 있는 객체로, 특정 사용자의 로그인 정보를 유지하기 위해 사용한다.
  • 우리가 웹사이트에 로그인한 뒤, 서버에서는 세션 ID로 회원 ID 정보를 기록한다.
• 클라이언트는 해당 세션을 계속 유지하여 다른 페이지로 이동할때도 세션 ID를 가지고 로그인 상태를 유지하여 서비스를 이용할 수 있다.
• 세션은 자신이 누구인지를 서버에 알려주는 역할을 수행함
• 만약 Session ID를 다른 클라이언트에게 탈취당하면, 다른 사람이 자신의 행세를 할 수 있다.

예시 

• 로그인 인증
  • 웹사이트에 한번 로그인 하면, 다른 페이지로 이동해도 계속 접속 상태가 유지된다. 
• 사용자 정보 관리
  • 사용자가 프로필 정보를 업데이트하면, 서버는 해당 정보를 세션에 저장하여 임시로 유지한다. 이후 다른 페이지에서 해당 정보를 필요로 할 때, 서버는 세션을 통해 사용자 정보를 제공한다.
• 쇼핑 카드 관리
  • 온라인 쇼핑 웹 사이트에서는 사용자의 장바구니 정보를 세션을 통해 관리한다. 사용자가 상품을 장바구니에 추가하면, 서버는 해당 정보를 세션에 저장합니다. 이후 사용자가 결제를 진행하거나 장바구니를 확인할 때, 서버는 세션을 통해 사용자의 장바구니 정보를 제공할 수 있다.

출처: 패스트캠퍼스_프론트엔드개발자가 알아야할 기초 공학지식 강의중

 

 

 

💡 상황예시에서 쿠키, 세션이 겹치는게 있는데 이럴때는 내가 개발하는 상황에서 어떤걸 고려하면 좋을지 봐야한다. 판단시 고려하면 좋은 것은 아래와 같다.

 

1. 데이터의 보안
   • 쿠키는 클라이언트(사용자)에 저장되기 때문에 보안에 취약할 수 있다. 사용자가 쿠키를 조작하거나 탈취당할 경우, 쿠키에 저장된 정보가 노출될 수 있다.
   • 세션은 서버에 저장되므로 보안적인 측면에서 좀 더 안전하다. 따라서 보안이 중요한 사용자 정보나 인증과 관련된 데이터를 다룰 때는 세션을 사용하는 것이 좋다.
2. 저장할 데이터의 크기
   • 쿠키는 클라이언트의 웹 브라우저에 저장되기 때문에 용량이 제한적이다. 일반적으로 4KB로 제한되어 있다. 따라서 쿠키는 작은 크기의 데이터를 저장하기에 적합하다.
   • 세션은 서버에 저장되므로 용량의 제한이 없습니다. 큰 용량의 데이터를 저장해야 할 경우에는 세션을 사용하는 것이 좋다.
3. 데이터의 지속성
   • 쿠키는 설정한 만료 날짜까지 유지될 수 있으며, 만료 날짜를 설정하지 않으면 브라우저를 종료할 때 삭제된다.
   • 세션은 사용자가 로그아웃하거나 브라우저를 종료할 때까지 유지된다. 데이터의 지속성이 필요한 경우에는 세션을 사용하는 것이 좋다.
4. 서버 자원 사용
   • 세션은 서버에 저장되므로 서버 자원을 사용한다. 만약 동시에 많은 사용자가 접속하는 경우, 세션 데이터의 양이 많아질 수 있어 서버 성능에 영향을 줄 수 있다. 대량의 사용자 데이터를 저장해야 할 경우에는 쿠키를 사용하는 것이 서버 자원을 덜 사용하므로 효율적이다.