본문 바로가기

Frontend Study - 2/Basic

쿠키 & 세션 & 캐시

HTTP의 특징 중 하나는 stateless 하다는 점이다.

서버가 클라이언트의 상태 정보를 가지지 않는다는 것, 기존의 정보를 유지하지 않는다.

이전에 '클라이언트 - 서버' 통신을 통해 데이터를 주고 받았다 하더라도,

다시 통신을 할 때 이전의 데이터 들을 가지고 있지 않기 때문에 처음부터 다시 시작해야 한다.

 

이것과 반대되는 개념은 stateful. 이전의 과정을 기억하는 것이다. stateful의 경우 기존의 상태를 기억하고 유지해야 하기 때문에 같은 서버를 통해 통신이 진행되어야 한다. 반면 stateless의 경우 상태를 보관하지 않기 때문에 클라이언트의 요청을 기존의 서버가 아닌, 다른 서버를 통해 response 해도 상관 없다. 

 

+http의 또다른 특징 connectionless

http는 '클라이언트 요청 - 서버 응답' 이후에 연결을 끊는다. 즉 연결을 유지 하지 않는다. 이를 통해 서버 자원을 효율적으로 이용할 수 있으며, 많은 클라이언트의 요청에도 대응할 수 있게 된다. 수 천명이 서비스를 사용해도 실제 동시에 처리하는 요청은 수 십개 이하로 많지 않다. 

 

하지만 분명 이전의 상태를 유지하는 것이 필요한 경우가 있다.

매번 통신 때마다 서버에게 모든 정보를 요청하고 받아오는 것이 비효율적일 때가 있다.  

 

 

쿠키, 세션, 캐시를 통해 문제를 해결할 수 있다. 

 

 

쿠키 & 세션 & 캐시

 

1. 쿠키

 

웹 브라우저를 통해 클라이언트의 로컬(브라우저)에 저장되는 작은 기록 정보.

 

- 쿠키는 클라이언트의 상태정보를 로컬(브라우저)에 저장해 두었다가 참조한다.

- 쿠키는 텍스트 파일이며, 직접 따로 요청하지 않아도 브라우저가 request시, request header에 넣어서 자동으로 서버에 전송한다. 

- 쿠키의 유효 시간, 즉 만료기간을 설정할 수 있고, 만료 기간이 정해지면 브라우저가 종료되어도 인증이 유지된다. 

- 구성 : 이름, 값, 만료 기간 (지정 가능), 경로 정보.

- 클라이언트에 300개까지 쿠키저장 가능, 하나의 도메인당 20개의 값만 가질 수 있음, 하나의 쿠키값은 4KB까지 저장

- 예시 : 자동 로그인, 쇼핑몰 장바구니, 팝업 몇일 간 보지 않기, 사용자가 이전에 스크롤링 했던 값 등

 

 

쿠키 통신 과정

  1.  사용자가 서버에 연결 요청을 보냅니다.
  2.  서버는 이때 쿠키(Cookie)를 생성합니다.
  3.  그리고 쿠키와 함께 연결 응답 정보를 전송 합니다.
  4.  사용자는 다음에 연결을 수행할 때 쿠키와 함께 데이터를 요청합니다.
  5.  서버는 이때 쿠키를 확인하고 사용자가 누구인지 확인한 후 그에 따른 응답을 하게 됩니다.

 

단점

 

사용자의 정보를 상대적으로 보안 취약한 로컬 디바이스에 저장하기 때문에 보안문제 발생. -> 세션을 통한 보완

쿠키에 대한 정보를 매 헤더에 추가하여 보내기 때문에 트래픽을 발생시킨다. -> 스토리지를 통한 보완

 

 

 

 

2. 세션

 

- 쿠키가 브라우저를 통해 클라이언트 단에 저장 되었다면, 세션은 서버에 저장된다.

- 서버에 저장되었기 때문에 상대적으로 쿠키에 비해 보안성이 높다.

- 각각의 클라이언트들을 구분하기 위해 유일한 세션ID를 부여하며(SessionID만 보내므로, 세션의 크기가 커도 네트워크 부하가 거의 없음 )  브라우저를 종료할 때 까지만 인증 상태를 유지한다.

- 서버에 저장된 값은 클라이언트가 브라우저를 종료하기 전까지 반영구적이다. 

- 서버에 데이터를 저장하므로 사용자가 많아질수록 서버 메모리를 많이 차지하게 된다. 동접자 수가 많은 웹 사이트인 경우 서버에 과부하를 주게 되므로 성능 저하의 요인이 된다.

- 브라우저 종료 전에도, 접속 시간 자체에 제한을 두어서 일정 시간 응답이 없을 경우 정보가 유지되지 않게 설정할 수 있다. 

 

 

 

 

세션 통신 과정

  1.  사용자가 서버에 연결 요청을 보냅니다.
  2.  서버는 이때 세션(Session)ID가 생성 및 저장됩니다
  3.  그리고 이러한 세션 정보를 쿠키에 입력하여, 함께 연결 응답 정보를 전송 합니다.
  4.  사용자는 다음에 연결을 수행할 때 쿠키와 함께 데이터를 요청합니다.
  5.  서버는 이때 쿠키를 확인하고, 쿠키에 입력된 세션정보를 통해 사용자가 누구인지 확인한 후 응답을 하게 됩니다.

 

 

 

3. 캐시

 

캐시는 앞서 설명한 두가지 쿠키와 세션과는 다른 개념이다. 

재 접속시 렌더링의 최적화를 위해 저장하는 데이터에 대한 것이다.

 

이미지, 비디오, CSS, JS파일 같은 것들이 포함된다.

 

한번 캐시에 저장되면 사이트 접속 시 브라우저를 참고하기 때문에, 해당 사이트의 내용이 서버에서 변경이 되어도 사용자는 변경되지 않게 보일 수 있다. 이런 부분은 캐시를 지워주거나 서버에서 클라이언트로 응답을 보낼 때 header에 캐시 만료시간을 명시하는 방법등을 이용해서 해결할 수 있다. 

 

 

참고사이트

https://joongbu.raonctf.com/essential/study/web/cookie_connection

https://velog.io/@duarufp06/HTTP-Stateless-Connectionless-HTTP-%EB%A9%94%EC%8B%9C%EC%A7%80-%EA%B0%9C%EB%85%90

'Frontend Study - 2 > Basic' 카테고리의 다른 글

인터넷이란 무엇인가?  (0) 2022.06.28
Semantic Web & Semantic Tag  (0) 2022.06.20
프로세스와 스레드 (Process & Thread)  (0) 2022.06.19