쿠키
서버가 웹 브라우저에 전송하는 작은 데이터 조각.
브라우저는 쿠키를 저장해놨다가 동일한 서버에 재요청 시 저장된 데이터를 함께 전송한다.
쿠키는 두 요청이 동일한 브라우저에서 들어왔는지 아닌지 판단할 때 주로 사용한다.
로그인 상태 유지 등에 이용할 수 있다.
쿠키의 3가지 목적:
- 세션 관리 (서버에 저장해야 할 로그인, 장바구니, 게임 스코어 등의 정보 관리)
- 개인화 (사용자 선호, 테마 등의 세팅)
- 트래킹 (사용자 행동을 기록하고 분석하는 용도)
세션
쿠키를 브라우저에 저장하는 것은 해킹의 위험이 있다.
쿠키와 달리 세션은 서버 측에서 관리한다.
서버에서는 클라이언트를 구분하기 위해 세션ID를 부여하며 브라우저가 서버에 접속해서 종료될 때까지 인증상태를 유지한다.
쿠키보다 보안에 좋지만 사용자가 많아질수록 메모리를 많이 차지한다.
동작 방식
- 클라이언트가 서버에 접속 시 세션ID를 발급 받음
- 클라이언트는 세션ID에 대해 쿠키를 사용해서 저장하고 가지고 있음
- 클라이언트는 서버에 요청할 때 세션ID를 같이 서버에 전달해서 요청함
- 서버는 전달받은 세션ID에 해당하는 클라이언트 정보를 사용함
- 서버는 클라이언트 정보로 요청을 처리하여 클라이언트에게 응답함
JWT
Json Web Token
- JSON 형태의 데이터를 안전하게 교환하여 사용할 수 있게 해준다.
- 인터넷 표준으로서 자리잡은 규격이다.
- 여러가지 암호화 알고리즘을 사용할 수 있다.
- header.payload.signature의 형식으로 3가지의 데이터를 포함한다. (.이 두개 포함된 데이터)
header: signature에서 어떤 암호화를 사용하여 생성된 데이터인지 표시
payload: 데이터
signature: 변조되지 않은 정상적인 토큰인지 확인
비밀 키를 모르더라도 복호화(조회)가 가능하다. 따라서 민감한 정보는 담지 않는 게 중요하다.
쿠키/세션 vs. JWT
쿠키/세션: 데이터를 교환하고 관리하는 방식
JWT: 데이터를 표현하는 형식
JWT 사용
- jsonwebtoken 설치
npm install jsonwebtoken- jwt
const jwt = require("jsonwebtoken");
const payloadData = {
myPayloadData: 1234,
};
// jwt 생성
const token = jwt.sign(payloadData, "mysecretKey");
console.log(token);
// jwt payload 데이터 복호화
const decodedValue = jwt.decode(token);
console.log(decodedValue);
// 비밀키 일치하는지 확인
// 일치
const decodedValueByVerify = jwt.verify(token, "mysecretKey");
console.log(decodedValueByVerify);
// 불일치
const decodedValueByVerifyToError = jwt.verify(token, "mysecratKey");
console.log(decodedValueByVerifyToError);로그인 예시)
const express = require("express");
const JWT = require("jsonwebtoken");
const app = express();
app.post("/login", async (req, res) => {
// 사용자 정보
const user = {
userId: 203,
email: "archepro84@gmail.com",
name: "이용우",
};
// 사용자 정보를 JWT로 생성
const userJWT = await JWT.sign(
user, // user 변수의 데이터를 payload에 할당
"secretOrPrivateKey", // JWT의 비밀키를 secretOrPrivateKey라는 문자열로 할당
{ expiresIn: "1h" } // JWT의 인증 만료시간을 1시간으로 설정
);
// userJWT 변수를 sparta 라는 이름을 가진 쿠키에 Bearer 토큰 형식으로 할당
res.cookie("sparta", `Bearer ${userJWT}`);
return res.status(200).end();
});
app.listen(5002, () => {
console.log(5002, "번호로 서버가 켜졌어요!");
});
로그인 기능을 구현할 때 서버가 만들었는지 인증을 확실하게 하기 위해 쿠키 정보 뿐 아니라 JWT를 통해서 만든 값을 인증/검증할 수 있도록 만들어야 한다.
보통 암호화된 데이터는 클라이언트(브라우저)가 전달받아 다양한 수단(쿠키, 로컬 등)을 통해 저장하여 API 서버에 요청을 할 때 서버가 요구하는 HTTP 인증 양식에 맞게 보내주어 인증을 시도한다.
COYG🔴⚪