[Web] 쿠키, 세션은 무엇일까?(feat.돈나무)

devicii·2021년 5월 11일

WEB

목록 보기
1/4

생각보다 자주 헷갈리는 개념

평소에 두루뭉술하게 기억하고 있던 쿠키, 세션, 캐시 등의 개념에 대해서
확실하게 정리하기 위해서 기록한다.

쿠키와 세션이 사용되는 이유

HTTP 프로토콜의 약점을 보완하기 위해서 사용한다.
HTTP 통신의 특징 중 Connectionless 하고 Stateless 하다는 특징이 있는데,
장점으로는 통신이 계속 유지된다면 쓸모없는 리소스가 사용을 줄인다는 것이지만,
약점으로는 통신을 할 때마다 내가 누구야! 라고 계속 인증을 해줘야 하는 번거로움이 생긴다. 예시로 내가 쿠팡에서 쇼핑을 하는데 메뉴창을 로그인 할 때마다 로그인이 풀려서 로그인을 해야한다면 과연 누가 그 서비스를 사용할까?

Connectionless: 클라이언트가 Request를 서버에 보내고, 서버가 클라이언트에게
Response를 한다면 서로 접속을 끊음

Stateless: 접속을 끊는 순간 클라이언트와 서버는 통신을 끝내고 상태 정보는 유지하지 않게 된다.

쿠키가 뭘까?

  • 쿠키는 브라우저 로컬에 key와 value로 저장되는 작은 데이터 파일(최대 4KB)이다.
  • 이름, 값, 만료날짜, 경로 정보 등이 들어있다.
  • 쿠키는 일정 시간 동안 데이터를 저장할 수 있어서 로그인 상태를 유지한다.
  • 클라이언트의 상태 정보를 브라우저에 저장해뒀다가 필요할 때 참조해서 사용한다.
  • 보안상의 취약점이 존재한다. 쿠키가 탈취당해서 위변조가 가능하다.

예시

  1. 쇼핑을 하러 쿠팡에 접속
  2. 쿠팡에 요청한 페이지를 Response받으면서 쿠키를 브라우저에 저장.
  3. 로켓직구, 로켓배송 페이지를 요리조리 이동할 때마다 쿠키값도 전송.

이로 인해서 계속 로그인 정보를 가지고 있는 것처럼 서비스를 이용할 수 있다.

실제 활용 예시
1. 우리가 웹서비스를 활용할 때 아이디 저장 기능이 쿠키를 활용한 것이다.
2. 우리를 귀찮게 하는 오늘 이 창을 보지 않음. 같은 기능
3. 쇼핑몰에서 장바구니 같은 기능을 쿠키를 통해서 구현한다.

중요한 점

쿠키는 보안상의 문제가 있기에 민감한 정보(ex.개인정보, 로그인 정보)에 대해서 각별한 주의가 필요하다.

  • XSS(크로스 사이트 스크립트)공격
    자바스크립트를 이용하여 document.cookie 값을 탈취할 수 있음
  • 스니핑(Sniffing)공격을 이용
    네트워크를 통해 전송되는 쿠키값을 암호화하지 않고 전송하는 경우 네트워크 스니핑 공격을 통해 쿠키값을 탈취할 수 있음

출처: https://coyagi.tistory.com/entry/시큐어코딩-쿠키-및-세션관리 [코코야이야기]

세션은 뭘까?

  • 세션은 쿠키를 기반으로 한다. 그거나 쿠키와 다르게 서버 측에서 관리하는 것이 특징이다.
  • 서버에서는 클라이언트의 구분을 위해 ID를 부여하고, 브라우저가 서버에 접속해 브라우저를 종료할 때까지 인증상태를 유지한다.
  • 클라이언트의 정보를 서버에 두기 때문에 쿠키보다 보안상에서 유리하지만, 서버에 저장하는 만큼 유저가 몰린다면 서버 메모리를 많이 차지하게 됩니다.

예시

  1. 클라이언트가 서버에 접속하면 고유한 세션 ID를 발급해준다.
  2. 클라이언트는 세션 ID를 쿠키를 통해 저장해서 보유하고 있는다.
  3. 클라이언트는 서버에 요청할 때마다 쿠키의 세션 ID를 서버에 전달한다.
  4. 문제가 없다면 세션ID로 해당 세션에 있는 고객의 정보를 가져온다.

로그인과 같은 보안상의 중요한 작업을 해야할 떄 주로 사용한다.

중요한 점

세션의 특징이 서버에 저장되기 때문에 사용자가 많을 수록 서버에 요구하는 부하가 커지고 메모리가 부족해지는 현상이 발생할 수 있다.

쿠키와 세션의 차이점

쿠키와 세션은 비슷한 역할을 한다.
세션도 결국엔 쿠키로 저장해서 사용하기 때문이다.
둘의 큰 차이점은 저장되는 위치이다. 쿠키는 클라이언트의 브라우저에 저장되어 보내는 역할을 하고, 세션은 서버에 저장돼 클라이언트에게 응답하기 때문이다.
보안 면에선 세션이 더 우수하지만, 요청 속도는 쿠키가 세션보다 더 빠르다. 그 이유는 세션은 서버에서의 처리가 한 번 더 필요하기 떄문이다

더 있다고? 로컬 스토리지는 뭘까?

HTML5에서 쿠키의 단점을 보완해서 만들어진 기술인 WebStorage중 하나이다.
key와 value로 이루어져 있다.
특징은 세션은 정보가 영구적이지 않지만, 로컬스토리지의 경우 강제적으로 지우지 않는 경우에 거의 영구적이다. 브라우저에 저장되어 있다.
또한 최대 5MB의 용량을 저장할 수 있다는 점이 큰 특징이다.

+++마지막. 캐시는 뭘까?

  • 캐시는 이미지,CSS,JS 파일을 브라우저에 저장해놓고 사용하는 것이다.
  • 한 번 캐시에 저장해놓으면 사용자가 다시 접속해도 이미 캐시에 저장되어 있기 때문에 응답하는 속도가 빠르다.


(요즘 핫한 긍적적으로든 부정적으로든 핫한 캐시우드에게 바치는 캐시의 짧은 설명이다. )

profile
흘러가는대로 사는

0개의 댓글