241125 TIL - JWT

잘 이해가 안 가는 JWT 복습!

 

JWT Json Web Token

• 서버와 클라 사이에서 정보를 안전하게 전송하기 위한 도움을 주는 웹 토큰
• JSON 형태의 데이터를 안전하게 전송 또는 검증할 수 있는 기능
• 인터넷 표준임, 특정 언어에 국한된 개념이 아님
• header.payload.signature 형식의 세 가지 데이터를 포함 (JWT 데이터는 항상 두개의 온점이 포함)
• 쿠키 또는 경로 매개변수를 통해 전달

https://jwt.io/

JWT.IO

 

Header

토큰의 타입과 어떤 암호화 방법을 사용했는지이 담김

{
  "alg": "HS256",
  "typ": "JWT"
}

 

Payload

실제 전달하려는 데이터의 내용이 담김

{
  "sub": "1234567890",
  "name": "John Doe",
  "iat": 1516239022
}

 

Signature

토큰의 변조 여부를 판단할 수 있음. 헤더와 페이로드, 그리고 비밀 키를 참고하여 생성됨

비밀키를 모르더라도 누구나 복호화가 가능하기 때문에, 민감한 정보는 담지 말아야 함

HMACSHA256(
  base64UrlEncode(header) + "." +
  base64UrlEncode(payload),
	secret
)

 

사용법

1. jsonwebtoken 라이브러리 설치

yarn add jsonwebtoken

 

2. 사용할 파일에 가져오기

import jwt from 'jsonwebtoken';

 

3. sign 메서드로 jwt로 변환한 데이터를 변수에 할당

const token = jwt.sign({ myPayloadData: 1234 }, 'mysecretkey');
// sign(페이로드 데이터, 비밀 키), 페이로드엔 문자열 뿐 아니라 객체도 할당 가능

/* token이 가진 jwt */
// eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9 (헤더)
// .eyJteVBheWxvYWREYXRhIjoxMjM0LCJpYXQiOjE2OTA4NzM4ODV9 (페이로드)
// .YUmYY9aef9HOO8f2d6Umh2gtWRXJjDkzjm5FPhsQEA0 (비밀 키)

 

4. decode 메서드로 jwt를 복호화

const decodedValue = jwt.decode(token);

/* 복호화 결과 */
// { myPayloadData: 1234, iat: 1690873885 }

 

5. verify 메서드로 변조 여부 검증

const decodedValueByVerify = jwt.verify(token, "secretkey");
// JsonWebTokenError: invalid signature (비밀키가 mysecretkey 였음)

 

활용

보통 암호화된 데이터는 클라가 쿠키나 로컬 저장소에 가지고 있다가, API 서버에 요청을 보낼 때 서버가 요구하는 HTTP 인증 방식에 맞게 보내주는 방식으로 인증을 시도함 

app.post('/login', (req, res) => {
  // 사용자 정보
  const user = {
    userId: 203,
    email: 'archepro84@gmail.com',
    name: '이용우',
  };

  // 사용자 정보를 JWT로 생성
  const userJWT = 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();
});

 

예시

1. 회원가입을 통해 아이디와 비밀번호가 서버에 저장됨
2. 클라가 로그인하면 서버는 이 정보를 검증하고, 유효하면 JWT를 생성해 클라에게 제공
3. 로그인이 된 클라는 이후 모든 API 요청에 JWT를 포함해 전송
4. 서버는 JWT 확인 후 유효하면 요청된 API에 응답