본문 바로가기
개발 공부

쿠키, 세션

by 억만장작 2021. 12. 20.

개요

로그인 기능을 구현하기 위해 자료조사를 하던 중 쿠키와 세션에 대한 언급이 자주 나와 따로 정리를 한다.

 

HTTP 특성

 

- connectionless :

http는 요청을 한 후 응답받으면 연결이 끊긴다.

클라이언트가 서버로 request를 보내면 서버는 response를 하고 연결이 끊어진다.

 

- stateless :

http는 연결이 끊겼을 때 상태를 저장하지 않는다.

즉 http 연결이 끊겼을 때에 이전에 가지고 있던 유저 정보나 로그인 상태 등 모든 상태는 날아간다.

여기서 쿠키와 세션을 이용하지 않는다면 쇼핑을 할 때에 새로운 페이지로 갈 때마다 로그인을 해줘야 한다.

 

 위와 같은 특성 때문에 로그인을 구현하기 위해서 쿠키와 세션에 대해서 알아야 한다고 판단했다.

 

쿠키(Cookie)

쿠키란?

- 쿠키는 클라이언트에 저장할 수 있는 키와 값으로 이루어진 작은 데이터 값이다.

- 유효 시간을 정할 수 있다.

- 로컬에 저장했다가 참조할 때 사용한다.

- 따로 언급을 하지 않아도 request header에 넣어서 알아서 서버(쿠키에 등록되어 있는 도메인)에 전송해준다.

 

쿠키의 구성 요소

- 이름 : 각각의 쿠키를 구별하는 데 사용되는 이름

- 값 : 쿠키의 이름과 관련된 값

- 유효시간 : 쿠키의 유지시간

- 도메인 : 쿠키를 전송할 도메인

- 경로 : 쿠키를 전송할 요청 경로

 

쿠키의 동작 방식

1. 클라이언트가 페이지를 요청

2. 서버에서 쿠키를 생성

3. HTTP 헤더에 쿠키를 포함시켜 응답

4. 브라우저가 종료되어도 쿠키 만료 기간이 있다면 클라이언트에서 보관하고 있음( 어떤 쿠키를 사용하느냐에 따라 없어질 수도 있다)

5. 같은 요청을 할 경우 HTTP 헤더에 쿠키를 함께 보냄

6. 서버에서 쿠키를 읽어 이전 상태 정보를 변경할 필요가 있을 때 쿠키를 업데이트하여 변경된 쿠키를 HTTP 헤더에 포함시켜 응답

 

쿠키 사용 예

- 방문 사이트에서 로그인 시, "아이디 비밀번호 저장"

- 쇼핑몰 장바구니

- 자동 로그인, 팝업에서 "오늘 더 이상 이 창을 보지 않음" 체크 여부

if (request.method === "GET" && request.url === "/login") {
      // 키는 login 값은 kimcoding 으로 설정
      if (!request.headers.cookie) {
        // Request 헤더에 쿠키 정보가 없는 경우
        response.writeHead(200, {
          "Set-Cookie": "login=kimcoding",
        });
      }

      response.write(fs.readFileSync("client/mypage.html"));
      request.pipe(response);
    }

서버 쪽에서 이렇게 클라이언트에 쿠키를 생성할 수 있다.

 

세션

세션이란?

- 쉽게 보면 서버 쪽에서 저장하는 쿠키

- 각 클라이언트 고유 세션 ID를 부여한다. 세션 ID로 클라이언트를 구분하여 각 클라이언트 요구에 맞는 서비스 제공

- 저장 데이터 제한이 없다.(쿠키는 제한이 있다.)

 

세션의 동작 방식

1. 클라이언트가 서버에 접속 시 세션 ID를 발급 받음.

2. 클라이언트는 세션 ID에 대해 쿠키를 사용해서 저장하고 가지고 있음.

3. 클라이언트는 서버에 요청 시 이 쿠키의 세션 ID를 같이 서버에 전달.

4. 서버는 세션 ID를 전달받아서 세션을 찾고 바로 클라이언트 정보를 가져와서 사용.

5. 그 정보로 요청을 처리하고 클라이언트에게 응답.

 

세션의 특징

- 각 클라이언트에게 고유 ID를 부여.

- 보안 쪽에서 쿠키보다 우수하다.

- 사용자가 많으면 서버의 부담이 커진다. (무분별하게 세션을 사용하면 서버의 자원을 많이 먹는다.)

- sessionStorage, localStorage, indexDB에 저장할 수 있는데 이때 

 

세션의 사용 예

- 로그인

sessionStorage.setItem("mineSession", "value" ); // 저장
sessionStorage.getItem("mineSession"); // value
sessionStorage.length; // 1
sessionStorage.key(0); // mineItRecord
sessionStorage.removeItem("mineSession"); // 삭제
sessionStorage.clear(); // 전체삭제

세션을 사용하는 법 (sessionStorage라는 저장공간을 사용한다. sessionStorage는 동기로 동작한다.)

 

세션, 쿠키 차이

- 사용자의 정보가 저장되는 위치. 쿠키는 클라이언트에, 세션은 서버에

- 세션이 보안 면에서 우수하지만 쿠키가 세션보다 더 빠르다. 세션은 서버의 처리가 필요하기 때문

- 세션은 결국 서버에 저장되어 있기 때문에 보안면에서 우수하다. 쿠키는 값이 변질되거나 request에서 스니핑 당할 우려가 있다.

- 쿠키는 브라우저를 종료해도 정보가 남아 있을 수 있다. 반면에 세션은 브라우저가 종료되면 (연결이 끊기면) 삭제된다.

- 쿠키에 정보가 있기 때문에 서버에 요청 시 속도가 빠르고 세션은 정보가 서버에 있기 때문에 처리가 요구되어 비교적 느린 속도를 가진다. 하지만 쿠키가 빠르다고 하여 무분별하게 사용하면 request 시 항상 붙어 가기 때문에 느려질 수 있다.

캐시와의 차이점

- 한번 캐시에 저장되면 브라우저를 참고하기 때문에 서버에서 변경이 되어도 사용자는 변경되지 않을 수 있다. 이 때는 캐시를 지워주거나 response시에 header에 캐시 만료시간을 명시하는 방법을 사용할 수 있다.(이럴 거면 그냥 쿠키를 쓰는 게...)

 

참고 사이트 : https://interconnection.tistory.com/74

 

'개발 공부' 카테고리의 다른 글

JWT(JSON Web Token)를 공부해보자  (0) 2021.12.20

댓글