[Web/HTTP] 쿠키 세션 토큰 JWT localstorage

서버의 무상태 특징때문에 사용자의 정보를 저장할 수 있는 방법을 만듬 : 쿠키,세션

 

쿠키

---

HTTP의 일종으로 사용자가 어떠한 웹 사이트를 방문할 경우,그 사이트가 사용하고 있는 서버에서 사용자의 컴퓨터에 저장하는 작은 기록 정보 파일이다.

HTTP에서 클라이언트의 상태 정보를 클라이언트의 PC에 저장하였다가필요시 정보를 참조하거나 재사용할 수 있다.

• 쿠키 특징
  1. 이름, 값, 만료일(저장 기간 설정), 경로 정보로 구성되어 있다.
  2. 클라이언트에 총 300개의 쿠키를 저장할 수 있다.
  3. 하나의 도메인 당 20개의 쿠키를 가질 수 있다
  4. 하나의 쿠키는 4KB(=4096byte)까지 저장 가능하다.
• 쿠키의 동작 순서
  1. 클라이언트가 페이지를 요청한다. (사용자가 웹사이트 접근)
  2. 웹 서버는 쿠키를 생성한다.
  3. 생성한 쿠키에 정보를 담아 HTTP 화면을 돌려줄 때,같이 클라이언트에게 돌려준다.
  4. 넘겨 받은 쿠키는 클라이언트가 가지고 있다가(로컬 PC에 저장)다시 서버에 요청할 때 요청과 함께 쿠키를 전송한다.
  5. 동일 사이트 재방문시 클라이언트의 PC에 해당 쿠키가 있는 경우,요청 페이지와 함께 쿠키를 전송한다.
• 사용 예시
  1. 방문했던 사이트에 다시 방문 하였을 때 아이디와 비밀번호 자동 입력
  2. 팝업창을 통해 "오늘 이 창을 다시 보지 않기" 체크

 

 

---

 

세션(Session)

---

방문자가 웹 서버에 접속해 있는 상태를 하나의 단위로 보고 그것을 세션이라고 한다.

방문자가 웹 브라우저를 통해웹 서버에 접속한 시점으로부터 웹 브라우저를 종료하여 연결을 끝내는 시점을 말한다.

• js 가 이벤트 날려서 브라우저 종료 알려줌
• 세션 특징
  1. 웹 서버에 웹 컨테이너의 상태를 유지하기 위한 정보를 저장한다.
  2. 브라우저를 닫거나, 서버에서 세션을 삭제했을때만 삭제가 되므로,쿠키보다 비교적 보안이 좋다.
  3. 각 클라이언트 고유 Session ID를 부여한다.Session ID로 클라이언트를 구분하여 각 클라이언트 요구에 맞는 서비스 제공
• 세션의 동작 순서
  1. 클라이언트가 페이지를 요청한다. (사용자가 웹사이트 접근)
  2. 서버는 접근한 클라이언트의 Request-Header 필드인 Cookie를 확인하여,클라이언트가 해당 session-id를 보냈는지 확인한다.
  3. session-id가 존재하지 않는다면,서버는 session-id를 생성해 클라이언트에게 돌려준다.
  4. 서버에서 클라이언트로 돌려준 session-id를 쿠키를 사용해 서버에 저장한다.쿠키 이름 : JSESSIONID
  5. 클라이언트는 재접속 시,이 쿠키(JSESSIONID)를 이용하여 session-id 값을 서버에 전달
• 사용 예시
  • 화면이 이동해도 로그인이 풀리지 않고 로그아웃하기 전까지 유지

세션을 쓰면되는데 굳이 쿠키를 사용하는 이유?

A. 세션이 쿠키에 비해 보안도 높은 편이나 쿠키를 사용하는 이유는세션은 서버에 저장되고, 서버자원을 사용하기 때문에 사용자가 많을 경우 소모되는 자원이 상당하다.이러한 자원관리 차원에서 쿠키와 세션을 적절한 요소 및 기능에 병행 사용하여,서버 자원의 낭비를 방지하며 웹사이트의 속도를 높일 수 있다.

 

 

---

 

Token

---

인증을 위해 사용되는 암호화된 문자열.

• 사용자가 인증에 성공하면 서버는 토큰을 생성해서 클라이언트로 보낸다.
• 토큰도 세션과 마찬가지로 사용자가 보내는 요청에 포함이 됨.
• 세션 인증에서는 서버가 세션 id를 저장하고 클라이언트가 쿠키에 실어 보낸 세션 id와 대조해서 확인하는 반면, 토큰을 사용하면 요청을 받은 서버는 토큰이 유효한지를 확인만 함. http통신의 stateless 한 성격과 더 적합한 인증 방식.
• 세션 인증에 비해 서버 운영의 효율이 더 좋다.
• 모바일환경에 적합하다.
• 인증정보를 다른 어플리케이션에 전달이 가능하다.
• 보안성이 좋다

토큰 사용 이유

• 기존 서버 기반 인증의 단점
  • 세션을 많이 사용하면 DB사용량이 많아 성능에 무리가 감
  • 세션을 사용하면 확장성이 줄어든다( 분산된 시스템 설계가 복잡)
  • 쿠키는 단일 도메인 및 서브 도메인만 사용하기 편함

토큰 인증과정

1. 유저가 아이디와 비밀번호로 로그인
2. 서버측에서 해당 계정정보를 검증
3. 계정정보가 정확하다면, 서버측에서 유저에게 signed 토큰을 발급여기서 signed 의 의미는 해당 토큰이 서버에서 정상적으로 발급된 토큰임을 증명
4. 클라이언트 측에서 전달받은 토큰을 저장해두고, 서버에 요청을 할 때 마다, 해당 토큰을 함께 서버에 전달
5. 서버는 토큰을 검증하고, 요청에 응답'

토큰 장점

• 무상태 & 확장성
• 보안성
• 다른 어플리케이션과 연동 가능

 

---

 

JWT(JSON Web Token)

---

• 웹표준 (RFC 7519) 으로서 두 개체에서 JSON 객체를 사용하여 가볍고 자가수용적인 (self-contained) 방식으로 정보를 안전성 있게 전달
• 다양한 언어 지원 (C, Java, PHP, C++ 등)
• 자가 수용적 → 필요한 모든 정보를 자체적으로 지님
  • 토큰 기본 정보
  • 유저 정보
  • 전달 정보
  • 토큰 검증
• 쉽게 전달가능 (HTTP 헤더에 넣거나 URL 파라미터로 전달 가능)

언제 유용??

• 회원 인증
• 정보 교류 : 정보가 sign이 되어 있어 정보를 보낸이가 바뀌지 않았는지 중간에 변경되지 않았는지 검증 가능
• aaaa.bbbb.cccc

 

---

WEB STORAGE

---

• Web Storage의 개념은 키/값 쌍으로 데이터를 저장하고 키를 기반으로 데이터를 조회
• 영구저장소(LocalStorage)와 임시저장소(SessionStorage)를 따로 두어 데이터의 지속성을 구분
• 이트의 도메인 단위로 접근이 제한

LocalStorage

• 저장한 데이터를 명시적으로 지우지 않는 이상 영구적으로 보관이 가능
• 도메인마다 별도로 로컬 스토로지가 생성
• Windows 전역 객체의 LocalStorage라는 컬렉션을 통해 저장
• 브라우저가 달라도 도메인만 같으면 데이터 공유가능
• 자주쓰는 이미지css 같은 거 캐싱 → 빨리 로딩 가넝

SessionStorage

• 데이터의 지속성과 액세스 범위에 특수한 제한이 존재
• SessionStorage는 windows 전역 객체의 sessionStorage라는 컬렉션을 통해 저장
• 브라우저가 다르면 같은 페이지 실행 시 별개의 영역으로 구분

WebStorage의 보안은 서로 다른 도메인의 데이터 침범을 막고는 있지만 클라이언트, 즉 사용자를 막고 있지는 않다. 클라이언트는 얼마든지 저장된 값을 임의로 수정이 가능하다. 이것은 쿠키와 동일한 개념이다. 그렇다고 쿠키에 비해 별다른 보안 취약점을 더 가진 것은 아니다. 따라서 개발자는 사용자에 의한 이러한 임의 변경에 항상 예의 주시하고 방어 코드의 작성을 잊지 말아야 한다.