쿠키, 세션 사용하는 이유
- 사용자가 로그인을 하고 다른 페이지로 이동을 했을 때, 그 로그인을 유지하기 위해서,
- 같은 사이트를 방문 시, 여러 개의 이미지들을 불필요한 로드를 없애기 위해서 등 여러가지 이유가 있다.
- 세밀하게 보면 HTTP와 관련이 있다
HTTP의 특징과 쿠키와 세션을 사용하는 이유
- HTTP 프로토콜의 특징이자 약점을 보완하기 위해서 사용한다.
- HTTP 프로토콜 환경에서 서버는 클라이언트가 누구인지 확인해야한다. 그 이유는 HTTP 프로토콜이 connectionless, stateless한 특성이 있기 때문이다.
- 예를 들어, 쿠키와 세션을 사용하지 않으면 쇼핑몰에서 옷을 구매하려고 로그인을 했음에도, 페이지를 이동할 때 마다 계속 로그인을 해야 한다.
쿠키와 세션을 사용했을 경우, 한 번 로그인을 하면 어떠한 방식에 의해서 그 사용자에 대한 인증을 유지하게 된다.
어떤 웹사이트에 접속시, 서버가 클라이언트(브라우저) 로컬에 전달하는 기와 값이 들어있는 작은 데이터 파일
즉, 서버가 웹 브라우저에 정보를 저장하고 불러올 수 있는 수단
- Response Header에 Set-Cookie 속성을 사용하면 클라이언트에 쿠키를 만들 수 있다.
- 서버가 쿠키를 브라우저에 저장해주고 해당 도메인에 대해 쿠키가 존재하면,
웹 브라우저는 도메인(서버)에게 요청(Request)시에 Request Header를 넣어서 자동으로 서버에 전송한다.- 쿠키는 서버에서 클라이언트에 영속성있는 데이터를 저장하는 방법이다.
서버는 클라이언트의 쿠키를 이용하여 데이터를 가져올 수 있다.
쿠키가 매 요청시 마다 자동으로 서버에 전달되는데
이를 바탕으로 사용자 선호, 테마 , 로그인 유지 등 장시간 보존해야하는 정보 저장에 적합하다.
- 방문 사이트에서 로그인 시, "아이디와 비밀번호를 저장하시겠습니까?"
- 쇼핑몰의 장바구니 기능
- 자동로그인, 팝업에서 "오늘 더 이상 이 창을 보지 않음" 체크
서버가 클라이언트에 특정한 데이터를 저장할 수 있다.
조건들은 아래 코드처럼 http 헤더를 사용해 쿠키 옵션으로 표현할 수 있습니다.
Set-Cookie HTTP 응답 헤더는 서버에서 사용자 브라우저에 쿠키를 전송하기 위해 사용한다.
'Set-Cookie':[ 'cookie=yummy', 'Secure=Secure; Secure', 'HttpOnly=HttpOnly; HttpOnly', 'Path=Path; Path=/cookie', 'Doamin=Domain; Domain=codestates.com' ]
http://www.localhost.com:3000/users/login
이라 하면 여기에서 Domain은 localhost.com 이다.http://www.localhost.com:3000/users/login
인 경우라면 여기에서 Path는 /users/login이 됩니다.MaxAge는 쿠키가 유효한 시간을 초 단위로 설정하는 옵션이다.
Expires는 MaxAge와 비슷하지만 언제까지 쿠키가 유효한지 심판의 날을 지정할 수 있다. 이때 옵션의 값은 클라이언트의 시간을 기준으로 한다.
이후 지정된 시간, 날짜를 초과하게 되면 쿠키는 자동으로 파괴된다.
쿠키는 위 옵션의 여부에 따라 세션 쿠키(Session Cookie)와 영속성 쿠키(Persistent Cookie)로 나눠진다.
http://www.codestates.com
또는 https://www.codestates.com
에 모두 쿠키를 전송할 수 있습니다.SameSite
Cross-Origin (CORS)요청을 받은 경우, 요청에서 사용한 메소드(e.g. GET, POST, PUT, PATCH …)와 해당 옵션의 조합을 기준으로 서버의 쿠키 전송 여부를 결정하게 된다.
사용 가능한 옵션은 다음과 같다.
Lax
: Cross-Origin 요청이라면 GET 메소드에 대해서만 쿠키를 전송할 수 있다.Strict
: 가장 엄격한 옵션으로, Cross-Origin이 아닌 same-site 인 경우에만 쿠키를 전송 할 수 있다.None
: Cross-Origin에 대해 가장 관대한 옵션으로 항상 쿠키를 보내줄 수 있다.
- 세션은 쿠키를 기반하고 있지만, 사용자 정보 파일을 브라우저에 저장하는 쿠키와 달리 세션은 서버 측에서 관리한다.
- 서버에서는 클라이언트를 구분하기 위해 세션 ID를 부여하며 웹 브라우저가 서버에 접속해서 브라우저를 종료할 때까지 인증상태를 유지한다.
- 물론 접속 시간에 제한을 두어 일정 시간 응답이 없다면 정보가 유지되지 않게 설정이 가능 하다.
- 사용자에 대한 정보를 서버에 두기 때문에 쿠키보다 보안에 좋지만, 사용자가 많아질수록 서버 메모리를 많이 차지하게 된다.
- 동접자 수가 많은 웹 사이트인 경우 서버에 과부하를 주게 되므로 성능 저하의 요인이 된다.
- 클라이언트가 Request를 보내면, 해당 서버의 엔진이 클라이언트에게 유일한 ID를 부여하는 데 이것이 세션ID다.
클라이언트가 서버에 접속 시 세션 ID를 발급 받음
사용자가 만일 정확한 아이디와 비밀번호를 입력했다면, 서버는 인증(Authentication)에 성공했다고 판단한다.
잠시 용어 정리 및 상세과정 살펴보기
클라이언트는 세션 ID에 대해 쿠키를 사용해서 저장하고 가지고 있다.
클라이언트는 서버에 요청할 때, 이 쿠키의 세션 ID를 서버에 전달해서 사용한다.
서버는 세션 ID를 전달 받아서 별다른 작업없이 세션 ID로 세션에 있는 클라언트 정보를 가져온다.
클라이언트 정보를 가지고 서버 요청을 처리하여 클라이언트에게 응답한다.
잠시 정리
세션 아이디가 담긴 쿠키는 클라이언트에 저장되어 있으며, 서버는 세션을 저장하고 있다.
그리고 서버는 그저 세션 아이디로만 인증 여부를 판단한다.
그러므로 로그아웃은 다음 두 가지 작업을 해야 한다.
- 서버: 세션 정보를 삭제해야 함.
- 클라이언트: 쿠키를 갱신하거나 삭제해야 함.
- 클라이언트에서 세션 정보를 없애기 위해서는 res.cookie로 쿠키의 값을 무효한 값으로 갱신하거나, res.clearCookie로 쿠키를 삭제해버리면 된다.
로그인 같이 보안상 중요한 작업을 수행할 때 사용
쿠키와 세션은 비슷한 역할을 하며, 동작원리도 비슷하다.
그 이유는 세션도 결국 쿠키를 사용하기 때문이다.
- 가장 큰 차이점: 사용자의 정보가 저장되는 위치
쿠키는 서버의 자원을 전혀 사용하지 않으며, 세션은 서버의 자원을 사용한다.- 보안: 세션이 더 우수하며, 요청 속도는 쿠키가 세션보다 더 빠르다.
그 이유는 세션은 서버의 처리가 필요하기 때문입니다.
- 쿠키는 클라이언트 로컬에 저장되기 때문에 변질되거나 request에서 스니핑 당할 우려가 있어서 보안에 취약하지만
세션은 쿠키를 이용해서 sessionid 만 저장하고 그것으로 구분해서 서버에서 처리하기 때문에 비교적 보안성이 좋다.- 라이프 사이클:
- 쿠키도 만료시간이 있지만 파일로 저장되기 때문에 브라우저를 종료해도 계속해서 정보가 남아 있을 수 있다. 또한 만료기간을 넉넉하게 잡아두면 쿠키삭제를 할 때 까지 유지될 수도 있다.
- 세션도 만료시간을 정할 수 있지만 브라우저가 종료되면 만료시간에 상관없이 삭제된다.
예를 들어, 크롬에서 다른 탭을 사용해도 세션은 공유된다.
다른 브라우저를 사용하게 되면 다른 세션을 사용할 수 있다.- 속도: 쿠키에 정보가 있기 때문에 서버에 요청시 속도가 빠르고 세션은 정보가 서버에 있기 때문에 처리가 요구되어 비교적 느린 속도를 가진다.
세션은 사용자의 수 만큼 서버 메모리를 차지하기 때문에,
최근에는 이런 문제들을 보완한 토큰 기반의 인증방식을 사용하는 추세이다.
그 중 JWT( JSON Web Token )라는 것이 있다.
이는 다음 포스팅에서 알아보자.