쿠키:
쿠키는 클라이언트 로컬에 저장되는 키와 값이 들어있는 작은 문자열 파일(4kb)이다.
쿠키는 클라이언트의 상태 정보를 로컬에 저장했다가 참조합니다.
HTTP 요청마다 포함되어 API 호출의 부담으로 작용할 수 있습니다.
사용자 인증이 유효한 시간을 명시할 수 있다, 유효 시간이 정해지면 브라우자가 종료되어도 인증이 유지된다.
HTTP 요청마다 쿠키는 HTTP header에 정보를 담아서 서버로 보내준다. 왜 매번 보내는걸까?
그 이유는 HTTP 프로토콜이 비연결성, 무상태성 한 특성이 있기 때문이다.
이 때 쿠키에 나에 대한 정보를 담아서 서버로 보내면 서버는 쿠키를 읽어서 내가 누군지 파악해야하기 때문이다.
그래서 쿠키는 처음부터 서버와 클라이언트 간의 지속적인 데이터 교환을 위해 만들어졌기 때문에 서버로 계속 전송이 된다.
여디서 문제가 생긴다 매번 쿠키전송으로 인한 웹 애플리케이션 성능저하뿐더러 만약 4kb 용량 제한을 거의 다 채운 쿠키가 있다면, 요청을 할 때마다 기본 4kb의 데이터를 사용해야함. 4kb 중에는 서버에서 필요하지 않는 정보들도 같이 보내질 수 있기때문에 데이터 낭비가 발생한다.
그럴때 필요한게 바로 로컬 스토리지와 세션 스토리지다
쿠키에 문제점:
-
CSRF 사용자의 권한을 이용한 공격
매번 서버에 요청할때마다 쿠키가 전송된다는 점을 활용해서 해커가 쿠키에게 악성 스크립트를 실행시켜 비벌번호 변경이나 결제요청을 하는등 위험할 수 있음.
(SameSite 설정으로 해결가능) 같은 도메인의 요청만 쿠키를 전송가능하게끔 설정. -
XSS
CSRF 와 같은 맥락으로 악성 스크립트를 실행시켜 사용자의 민감한 정보를 탈취한다.
(httpOnly 설정으로 스크립트접근 차단 가능) -
부족한 용량 (위에서 설명)
-
매번 HTTP 요청시 자동으로 쿠키정보 전송 (위에서 설명) 트래픽 증가.
로컬 스토리지:
가장 큰 특징으로는 브라우저 창을 닫더라도 데이터가 유지됩니다. 장점은 서버에 불필요한 데이터를 저장하지 않는 다는 점입니다.
그리고 브라우저마다 차이는 있지만 용량이 약 5MB로 매우 큽니다. HTML5를 지원하지 않는 브라우저에서는 사용할 수 없습니다.
자동로그인 사용자 설정, 글 임시저장 브라우저 다크모드 등등을 저장할때 활용하는것이 좋다.
세션 스토리지:
가장 큰 특징으로는 브라우저 창을 닫는 순간 영구적으로 데이터가 삭제됩니다.
세션스토리지도 마찬가지로 서버에 불필요한 데이터를 저장하지 않고, 용량이 5MB로 매우 크고 HTML5를 지원하지 않는 브라우저에서는 사용할 수 없습니다.
주로 폼 정보나 장바구니 정보 등 휘발성이 강한 개인적인 내용을 담는다.
웹 스토리지 특성
- 이 두 저장소의 데이터는 서버로 자동 전송되지 않는다.
- 두 스토리지는 모두 window 객체 안에 들어 있다. Storage객체를 상속받기 때문에 메소드가 공통적으로 존재.(브라우저 구조면에서는 Data persitance 에 저장이 된다)
- 쿠키랑 똑같이 문자열로 저장이된다. (직렬화를 통해서 객체도 저장이 가능하다)
- 도메인 별용량 제한도 있음(프로토콜, 호스트, 포트가 같으면 같은 스토리지를 공유)
쿠키와 웹스토리지 정리
쿠키와 웹 스토리지는 보안 문제가 있기 때문에 민감한 정보는 정장하지않는걸 추천드립니다.
쿠키는 서버와 소통할때 필요한 데이터들을 저장하는게 좋고
세션 스토리지는 탭 종료시 삭제되어도 괜찮은 이전페이지, 이전 스크롤 위치 저장등등 을 저장하는데 좋고
로컬 스토리지는 사용자 설정, 글 임시저장 브라우저 다크모드 등등을 저장할때 활용하는것이 좋다.
세션:
- 세션은 쿠키를 기반하고 있지만, 사용자 정보 파일을 브라우저에 저장하는 쿠키와 달리 세션은 서버 측에서 관리
- 서버에서는 클라이언트를 구분하기 위해 세션 ID를 부여하며 웹 브라우저가 서버에 접속해서 브라우저를 종료할 때까지 인증상태를 유지
- 물론 접속 시간에 제한을 두어 일정 시간 응답이 없다면 정보가 유지되지 않게 설정이 가능
- 사용자에 대한 정보를 서버에 두기 때문에 쿠키보다 보안에 좋지만, 사용자가 많아질수록 서버 메모리를 많이 차지하게 됨.
- 즉 동접자 수가 많은 웹 사이트인 경우 서버에 과부하를 주게 되므로 성능 저하의 요인이 됨.
- 클라이언트가 Request를 보내면, 해당 서버의 엔진이 클라이언트에게 유일한 ID를 부여하는 데 이것이 세션ID.
세션의 동작 방식
- 클라이언트가 서버에 접속 시 세션 ID를 발급.
- 클라이언트는 세션 ID에 대해 쿠키를 사용해서 저장하고 가지고 있음
- 클라리언트는 서버에 요청할 때, 이 쿠키의 세션 ID를 서버에 전달해서 사용.
- 서버는 세션 ID를 전달 받아서 별다른 작업없이 세션 ID로 세션에 있는 클라언트 정보를 가져옴.
- 클라이언트 정보를 가지고 서버 요청을 처리하여 클라이언트에게 응답.
세션의 특징
- 각 클라이언트에게 고유 ID를 부여
- 세션 ID로 클라이언트를 구분해서 클라이언트의 요구에 맞는 서비스를 제공
- 보안 면에서 쿠키보다 우수
- 사용자가 많아질수록 서버 메모리를 많이 차지하게 됨.
