쿠키, 세션, 웹 스토리지(로컬/세션) 비교

HTTP 의 특징

비연결지향 ( Connectionless )

• request 에 대한 response 를 해주면 서버와 클라이언트가 연결이 끊어진다. 커넥션을 낭비하지 않기 때문에 리소스의 낭비를 줄일 수 있다.

 

상태없음 ( Stateless )

• 연결을 끊는 순간 상태 정보를 유지하지 않는다.

 

쿠키와 세션을 쓰는 이유는 ?

• HTTP의 2가지 특징인 비연결지향(connectionless) 와 상태없음(stateless) 로 인해 서버는 클라이언트의 상태를 알 수 없다.
• 클라이언트의 상태를 알아야 될 경우 ( ex. 인증 ) 쿠키와 세션을 사용한다.

 

쿠키

• Cookie-name : Cookie-value’ 형태의 저장소 구조를 갖는다.
• Cookie-value는 문자열 형태만 가지며, 클라이언트에 300개까지 쿠키저장 가능, 하나의 도메인당 20개의 값만 가질 수 있으며, 하나의 쿠키값은 4KB까지 저장이 가능하다. 
• 쿠키는 클라이언트가 서버에 접속한 방문 정보를 클라이언트에 저장하기에 매번 서버 전송이 되기에 자원 소모가 발생한다.
• 쿠키는 오랜시간 동안 유지될 수 있고, 자바스크립트를 이용하여 쿠키에 접근할 수 있기에 쿠키에 민감한 정보를 담기에 CSRF 공격에 취약하다.

 

CSRF 공격(Cross Site Request Forgery)
웹 어플리케이션 취약점 중 하나로 인터넷 사용자(희생자)가 자신의 의지와는 무관하게 공격자가 의도한 행위(수정, 삭제, 등록 등)를 특정 웹사이트에 요청하게 만드는 공격입니다.

 

세션 쿠키(session cookies)

• 쿠키에 만료일이 포함되지 않으면 세션 쿠키(session cookies)로 간주된다.
• 세션 쿠키는 디스크에 저장되지 않고 메모리에 저장되어 브라우저나 탭이 닫히면 영구적으로 삭제 된다.

 

지속적 쿠키(persistent cookies)

• 반대로 만료일이 포함될 경우 지속적 쿠키(persistent cookies)로 간주된다. 
• 디스크에 저장되어 수동으로 삭제하기 전까진 만료 기한까지 데이터가 저장 된다.

 

 

세션 ( Session )

세션이란?

• 세션은 쿠키를 기반하고 있지만, 사용자 정보 파일을 브라우저에 저장하는 쿠키와 달리 세션은 서버 측에서 관리한다
• 서버에서는 클라이언트를 구분하기 위해 세션 ID를 부여하며 웹 브라우저가 서버에 접속해서 브라우저를 종료할 때까지 인증상태를 유지한다
  
  •  접속 시간에 제한을 두어 일정 시간 응답이 없다면 정보가 유지되지 않게 설정이 가능하다    
    
    
• 사용자에 대한 정보를 서버에 두기 때문에 쿠키보다 보안에 좋지만, 사용자가 많아질수록 서버 메모리를 많이 차지하게 된다
  • 즉 동접자 수가 많은 웹 사이트인 경우 서버에 과부하를 주게 되므로 성능 저하의 요인이 된다
• 클라이언트가 Request를 보내면, 해당 서버의 엔진이 클라이언트에게 유일한 ID를 부여하는 데 이것이 세션ID이다

 

특징

• 각 클라이언트에게 고유 ID를 부여
• 세션 ID로 클라이언트를 구분해서 클라이언트의 요구에 맞는 서비스를 제공한다
• 보안 면에서 쿠키보다 우수
• 사용자가 많아질수록 서버 메모리를 많이 차지하게 된다

세션의 사용 예

• 로그인 같이 보안상 중요한 작업을 수행할 때 사용한다

 

웹 스토리지

• 브라우저에 저장할 수 있도록 HTML5부터 새롭게 지원하는 저장소다.
• 쿠키의 여러 사용을 웹 스토리지(web storage)가 대체하게 되었다.
• 키(key)-값(value) 저장소이며 쿠키와 달리 HTTP 요청에서 데이터를 주고받을 필요가 없어서 서버에 부담을 덜어준다.
• ‘Value’는 문자열 형태만 가지며, 브라우저마다 상이하지만 최대 모바일은 2.5KB, 데스크톱은 약 5 ~ 10KB의 제한 용량을 가지고 있다.
• 종류로는 로컬 스토리지(local storage)와 세션 스토리지(session storage)가 있다. 이 둘은 사용방법이 같지만 가장 큰 차이점은 영구성에 있다. 

 

로컬 스토리지(Local Storage)

• 로컬 스토리지는 브라우저를 종료해도 사용자의 디스크에 저장되어 데이터가 삭제되지 않으며 수동으로 지우지 않는한 영구적으로 저장이 된다.
• 도메인 단위로 생성이 되며 다른 도메인의 로컬 스토리지에는 접근이 불가능하다.
• 서로 다른 브라우저의 탭이라도 도메인이 같으면 같은 로컬 스토리지를 사용한다.

 

세션 스토리지(Session Storage)

• 세션 스토리지는 브라우저를 종료하거나 OS를 종료하면 사라지고 새로고침이나 브라우저 탭이 유지될 때에만 해당 저장소가 유지된다.
• 세션 스토리지는 동일한 도메인과 탭에서만 유효하며, 다른 도메인 혹은 브라우저 내에서는 유효하지 않는다.
• 탭/윈도우 단위로 생성이 되며 도메인이 같아도 탭이 다르면 데이터에 접근이 불가능하다.

 

저장소별 사용예

	세션 쿠키 (session cookies)	지속적쿠키 (persistent cookies)	로컬 스토리지 (local storage)	세션 스토리지 (session storage)
사용예	- 은행 웹 사이트의 개인정보 인증 - 회원가입 입력 폼 - 보안영역 접속 등	- 좀더 나은 사용자 경험을 위한 사용기록 추적, - 오늘 이 창 보지 않음 체크 등	- 자동 로그인 기능	-일회성 로그인 -블로그 글 에디터의 자동저장 기능 등

 

쿠키 / 웹 스토리지(로컬/세션) 표 비교

분류	쿠키(Cookie)	로컬 스토리지(Local Stroage)	세션 스토리지(Session Storage)
구조	‘Cookie-name : Cookie-value’	‘Key : Value’	‘Key : Value’
최대 크기	4KB	모바일 : 2.5KB, 데스크 탑: 5 ~ 10KB	모바일 : 2.5KB, 데스크 탑: 5 ~ 10KB
유효 시점	- 지정한 만료기간까지 유효합니다	- 브라우저 및 OS를 종료하더라도 유효합니다.	- 새로고침이나 브라우저 탭이 유지될때까지만 유효합니다.
소멸 시점	- 지정한 만료기간이 지나면 소멸됩니다.	- 강제적으로 삭제 및 초기화를 할 때 소멸됩니다.	- 탭을 닫거나 브라우저를 닫으며 OS를 종료 시 소멸됩니다.
서버의 전송여부	O (요청 마다 방문정보를 저장함)	X	X
장점	- 대부분의 브라우저에서 제공한다. - 유저의 웹 사이트 방문내역을 추적하여 쿠키 제공자의 접속 패턴을 파악하여 유저와 관련성이 높은 마케팅 정보를 제공한다.	- 서버로 전송되지 않기에 상대적 자원소모가 적다 - 필요한 경우에만 꺼내서 쓰기 때문에 자동 전송이 되지 않는다	- 서버로 전송되지 않기에 상대적 자원소모가 적다 - 필요한 경우에만 꺼내서 쓰기 때문에 자동 전송이 되지 않는다
단점	- 매번 서버로 전송되기에 상대적 자원소모가 있다 - 쿠키에 접근이 가능하고 조작하여 CSRF 보안에 취약하다.	- HTML5를 지원하지 않는 브라우저에서는 사용이 불가능하다	- HTML5를 지원하지 않는 브라우저에서는 사용이 불가능하다
사용처	- 로그인 화면에서 ‘아이디 자동완성’ 기능 - 팝업 화면에서 ‘오늘 하루 보지 않기' 기능 - 미 로그인 상태에서 ‘장바구니 담기’ 기능	- 로그인 화면에서 ‘자동 로그인' 기능	- 임시로 유지되는 입력 폼 정보 - 새로고침 시 데이터 유지 정보 - 일회성 로그인 정보

 

참고 자료
https://adjh54.tistory.com/57#--%--%EC%--%B-%EC%--%--%--%EC%-A%A-%ED%--%A-%EB%A-%AC%EC%A-%---Session%--Storage-
 https://onlydev.tistory.com/25
 https://racoonlotty.tistory.com/entry/%EC%BF%A0%ED%82%A4%EC%99%80-%EC%84%B8%EC%85%98-%EA%B7%B8%EB%A6%AC%EA%B3%A0-%EB%A1%9C%EC%BB%AC-%EC%8A%A4%ED%86%A0%EB%A6%AC%EC%A7%80%EC%99%80-%EC%84%B8%EC%85%98-%EC%8A%A4%ED%86%A0%EB%A6%AC%EC%A7%80