쿠키, 세션, 로컬 스토리지, JWT는 클라이언트-서버 아키텍처에서의 데이터를 저장 및 관리, 인증 및 보안에 필요한 기술들입니다. 각각의 특징을 살펴보겠습니다.

1. 쿠키(Cookie)와 세션(Session)

: 쿠키와 세션은 웹 브라우징 중 사용자 정보를 저장하고 추적하는 방법입니다. 각각의 특징은 다음과 같습니다.

1) 쿠키(Cookie)란?

: 쿠키는 작은 텍스트 파일로, 웹 서버가 사용자의 브라우저에 전달하여 저장하는 방식입니다. 웹 브라우징 중 발생하는 다양한 정보와 상태를 저장하고 관리할 수 있으며, 서버와 클라이언트 사이에서 주고받을 수 있습니다.

- 주요특징

• 클라이언트 저장 : 쿠키는 사용자의 브라우저에 저장됩니다. 따라서 사용자가 동일한 웹 사이트를 재방문할 때 이전의 상태 정보를 기억할 수 있게 해줍니다.
• 크기 제한 : 쿠키 하나당 4KB의 크기 제한이 있으므로 많은 정보를 저장하기에는 부적합합니다.
• 만료시간 설정 : 쿠키에는 만료 시간을 설정할 수 있으며, 만료 시간이 지나면 자동으로 삭제됩니다.
• 보안 : 중요한 정보를 담고 있는 쿠키의 경우, 보안 상 취약할 수 있으므로 HTTPS 및 Secure 플래그 사용 등의 보안 조치가 필요합니다.
• 용도 : 사용자 인증, 세션 관리, 사용자 선호 설정 저장, 트래킹 등 다양한 목적으로 사용됩니다.

- 작동 방식

1. 사용자가 웹 사이트를 처음 방문하면 서버는 HTTP 응답 헤더에 Set-Cookie를 통해 쿠키를 설정합니다.
2. 브라우저는 이 쿠키를 저장하고, 이후 해당 도메인에 대한 모든 요청에 쿠키를 HTTP 요청 헤더에 포함시켜 서버에 전송합니다.
3. 서버는 이 쿠키 정보를 통해 사용자를 식별하고, 필요한 처리를 수행합니다.

- 예제 사용 사례

• 로그인 상태 유지
• 장바구니에 담긴 상품 정보 저장
• 사용자 언어 선호도 및 테마 설정 저장

📌 쿠키는 사용이 간편하고 대부분의 웹 브라우저에서 지원되지만, 특징에서 언급했던 것처럼 크기 제한과 보안상의 취약점 때문에 중요한 정보의 저장에는 신중을 기해야 합니다. 그럼에도 불구하고 사용자 맞춤화와 상태 유지 등 다양한 웹 애플리케이션 기능을 구현하는 데 매우 중요한 역할을 합니다.

2) 세션 (Session)이란?

세션은 웹 서버가 사용자의 브라우저를 식별하기 위한 기술로, 사용자가 웹 사이트에 방문할 때부터 떠날 때까지의 일련의 상호작용을 하나의 상태로 관리합니다.

- 주요특징

• 서버 저장 : 세션 데이터는 서버 측에서 저장되며, 클라이언트에는 세션 ID만 전달됩니다.
• 크기 제한 : 서버에서 처리하므로 쿠키와 달리 크기 제한이 없습니다.
• 만료시간 설정 : 일반적으로 사용자가 브라우저를 종료하면 세션도 만료되지만, 서버에서 설정한 만료 시간에 따라 달라질 수 있습니다.
• 보안 : 클라이언트에는 실제 데이터가 저장되지 않으므로 쿠키보다 상대적으로 보안성이 높습니다.
• 용도 : 사용자 인증, 세션 관리, 사용자 선호 설정 저장, 상태 유지 등 다양한 목적으로 사용됩니다.

- 작동 방식

1. 사용자가 웹 사이트에 로그인하거나 특정 작업을 수행하면 서버는 해당 사용자를 위한 세션을 생성합니다.
2. 서버는 생성된 세션 ID를 클라이언트의 쿠키로 전송합니다. 클라이언트는 이후 요청마다 이 세션 ID를 함께 전송합니다.
3. 서버는 세션 ID를 통해 사용자의 세션 데이터를 찾아 활용합니다. 예를 들어, 로그인 상태 확인, 사용자별 설정 적용 등이 가능합니다.
4. 세션의 유효 시간이 만료되거나 사용자가 로그아웃하면 세션은 종료됩니다.

- 예제 사용 사례

• 로그인 상태 및 사용자 권한 관리
• 사용자별 임시 데이터 저장 (예: 장바구니, 진행 중인 설문조사 등)
• 사용자 행동 추적 및 분석

📌 세션은 클라이언트와 서버 간 상태를 유지하고 식별하는 데 쓰이는 중요한 기술입니다. 세션을 사용하면 사용자별로 개인화된 경험을 제공할 수 있으며, 상태를 유지하면서도 상대적으로 안전한 방식으로 데이터를 관리할 수 있습니다. 그러나 세션을 과도하게 사용하면 서버의 메모리 부담이 커질 수 있으므로 적절한 설계와 관리가 필요합니다.

1-1) 쿠키와 세션의 공통점과 차이점

공통점 : 쿠키와 세션은 많은 면에서 유사한 목적으로 사용됩니다. 앞서 설명한 것처럼 사용자 인증, 세션 관리, 사용자의 선호 설정 저장등의 다양한 목적으로 사용됩니다. 둘 다 웹 브라우저와 서버 간의 상태를 유지하고, 사용자의 개별 설정과 정보를 추적하는데 사용되는 기술입니다.

차이점

• 저장 위치 : 쿠키는 클라이언트 측에 저장되며, 세션은 서버 측에 저장됩니다.
• 보안성 : 세션은 서버에 저장되기 때문에 상대적으로 쿠키보다 더 안전하게 데이터를 저장할 수 있습니다.
• 생명 주기 : 쿠키는 만료 날짜를 설정할 수 있어 지정된 기간 동안 데이터를 보관할 수 있으며, 세션은 일반적으로 브라우저가 닫히면 만료됩니다.

2. 로컬 스토리지 (Local Storage)란?

로컬 스토리지(Local Storage)는 웹 스토리지 API의 일부로, 사용자의 웹 브라우저 내에 키-값 쌍의 데이터를 저장할 수 있는 클라이언트 측 저장 방법입니다. 로컬 스토리지에 대한 구체적인 특징과 사용 방법은 다음과 같습니다.

- 주요특징

• 클라이언트 저장 : 로컬 스토리지는 웹 브라우저에 직접 저장되며, 서버에 전송되지 않습니다.
• 크기 제한 : 대부분의 브라우저에서 5MB 정도의 저장 공간을 제공합니다.
• 만료시간 : 만료 날짜가 없으므로 사용자가 직접 삭제하지 않는 한 데이터가 영구적으로 저장됩니다.
• 보안 : 중요한 또는 민감한 정보를 저장하는데는 적합하지 않을 수 있습니다. 클라이언트 측에서 읽고 쓰기가 가능하므로 XSS 공격 등에 취약할 수 있습니다.
• 용도 : 캐싱, 세션 간 상태 유지, 사용자 선호 설정 저장, 장바구니 정보 저장와 같은 목적으로 사용됩니다.
• 도메인 별 접근 제한: 같은 도메인, 프로토콜, 포트에서만 접근이 가능하며, 다른 도메인에서는 접근할 수 없습니다.
• 사용 편의성: JavaScript를 이용해 쉽게 읽고 쓸 수 있으며, JSON과 같은 형식으로 복잡한 데이터 구조도 저장할 수 있습니다.

- 작동 방식

1. 웹 페이지에서 JavaScript를 사용하여 localStorage 객체를 통해 데이터를 저장합니다. 예: localStorage.setItem(‘key’, ‘value’).
2. 로컬 스토리지는 클라이언트 측에 저장되므로 서버에 의존하지 않습니다. 데이터는 사용자의 웹 브라우저에 직접 저장됩니다. 로컬 스토리지에 저장된 데이터는 동일 출처 정책을 따르므로 같은 도메인, 프로토콜, 포트에서만 접근 가능합니다.
3. 저장된 데이터는 동일한 도메인에서 JavaScript를 사용하여 읽을 수 있으며, 예: localStorage.getItem(‘key’)로 값을 받아옵니다.
4. 로컬 스토리지에 저장된 데이터는 만료 시간이 없으며, 브라우저 캐시를 지우거나 사용자가 직접 삭제하기 전까지 저장됩니다.

- 예제 사용 사례

• 게임 상태 저장
• 사용자별 임시 데이터 저장 (예: 장바구니, 진행 중인 설문조사 등)
• 최근 검색어 또는 방문 기록

📌 로컬 스토리지는 클라이언트 측에서 데이터를 영구적으로 저장할 수 있는 방법으로, 세션과 쿠키와 달리 만료 시간이 없습니다. 또한, 서버와는 독립적으로 동작하며, 사용자 경험을 풍부하게 만드는 데 활용될 수 있습니다. 그러나 중요한 데이터를 저장하기에는 보안상 취약할 수 있으므로 주의가 필요합니다.

4. JSON Web Token (JWT)란?

JSON Web Token (JWT)는 사용자 인증과 정보 교환을 위한 컴팩트하고 독립적인 방식으로, 정보를 JSON 객체로 표현합니다. 이 토큰은 디지털 서명되어 있어 정보의 무결성을 보장합니다.

📍토큰 : 토큰(token)은 정보 시스템에서 인증이나 권한 관리를 위한 수단으로 사용되는 작은 데이터 조각을 의미합니다. 토큰은 사용자의 인증 정보, 권한, 세션 상태 등을 담고 있을 수 있으며, 서버와 클라이언트 간에 정보를 안전하게 전송하는 데 사용됩니다.

- 주요특징

• 무결성 보장 : JWT는 디지털 서명을 통해 정보의 무결성을 보장합니다.
• 자기 포함 : JWT는 자체적으로 정보를 담고 있으므로 별도의 저장소가 필요하지 않습니다.
• 상태 비저장 : JWT는 상태를 저장하지 않는 토큰이므로, 서버 측에서 세션을 유지할 필요가 없습니다.
• 보안 : 중요한 정보는 JWT 내에 암호화될 수 있으나, 헤더와 페이로드는 Base64로 인코딩되므로 외부에서 읽을 수 있습니다.
• 크기 제한: 토큰에 많은 정보를 넣으면 토큰의 크기가 커지므로, 필요한 정보만 포함해야 합니다.

- 작동 방식

1. 인증: 사용자가 로그인하면 서버는 사용자의 정보와 권한을 포함한 JWT를 생성합니다.
2. 서명: 생성된 JWT는 비밀 키로 서명되어 무결성이 보장됩니다.
3. 전송: 서명된 JWT는 클라이언트에게 전송되고, 클라이언트는 이후 요청에 토큰을 헤더에 포함시킵니다.
4. 검증: 서버는 헤더에 포함된 JWT를 받아 서명을 검증하고, 유효하면 요청을 처리합니다.
5. 만료: JWT는 만료 시간을 포함할 수 있으며, 이 시간이 지나면 토큰은 무효화됩니다.

- 예제 사용 사례

• 싱글 사인온 (SSO) : 여러 개의 서비스가 있는 대기업에서 사용자가 한 번 로그인하면 다른 연계 서비스에도 자동으로 로그인되는 시스템.
• 사용자 인증 및 권한 관리
• 정보 교환: 두 개체 간에 안전하게 정보를 전송합니다.

📌 JWT는 클라이언트와 서버 간의 안전한 정보 교환을 위한 강력한 도구입니다. 상태 비저장 성격 덕분에 확장성이 뛰어나며, 여러 시스템 간의 인증을 단순화할 수 있습니다. 그러나 중요한 정보의 경우 추가적인 암호화가 필요하며, 토큰의 크기와 보안을 잘 관리해야 합니다. 결론적으로 JWT는 사용자의 신원을 보장하고 인증을 처리하기 위한 목적이 주가 됩니다.

5. 한번에 모아보기

• 쿠키 : 사용자와 서버 간의 상태 정보를 저장하며, 클라이언트와 서버 사이에 매 요청마다 전송됩니다. 세션 관리, 트래킹, 사용자 인증 등에 사용됩니다.

• 세션 : 서버 측에서 관리되는 사용자 식별 기술로, 로그인 상태 및 사용자 권한 관리, 임시 데이터 저장 등에 활용됩니다. 상대적으로 보안성이 높으나, 과도한 사용은 서버 부담을 증가시킬 수 있습니다.

• 로컬 스토리지 : 클라이언트 측에서 독립적으로 작동하며, 데이터는 사용자의 웹 브라우저에 저장됩니다. 사용자의 선호 설정, 장바구니 정보 등의 비민감한 정보 저장에 주로 사용됩니다.

• JSON Web Token (JWT) : 클라이언트와 서버 간의 안전한 정보 교환을 위한 토큰 기반 인증 방식입니다. 사용자 신원 보장과 권한 관리에 주로 사용되며, 무결성을 제공합니다.