์นดํ…Œ๊ณ ๋ฆฌ ์—†์Œ

๐Ÿ”‘ Session ๊ณผ JWT(JSON Web Token)

hhenyy 2024. 1. 23. 17:54

๐Ÿ”‘ Session ๊ณผ  JWT(JSON Web Token)

๐Ÿ‘‰ ์„ธ์…˜์— ๋Œ€ํ•˜์—ฌ ์ข€ ๋” ์ž์„ธํžˆ ์•Œ๊ณ  ์‹ถ๋‹ค๋ฉด ์•„๋ž˜์˜ ๋งํฌ๋ฅผ ํด๋ฆญํ•˜์„ธ์š”.

https://develop-const.tistory.com/13

 

์ฟ ํ‚ค vs ์„ธ์…˜(cookie vs session)

๊ณตํ†ต์ ์€ ๋ฌด์—‡์ผ๊นŒ? ์ฟ ํ‚ค์™€ ์„ธ์…˜์€ ๋ชจ๋‘ http ํ”„๋กœํ† ์ฝœ์—์„œ ํด๋ผ์ด์–ธํŠธ์™€ ์„œ๋ฒ„๊ฐ€ ์ƒํƒœ๋ฅผ ์œ ์ง€ํ•˜๊ธฐ ์œ„ํ•ด ์‚ฌ์šฉ๋˜๋Š” ๊ฒƒ์ž…๋‹ˆ๋‹ค. ์ฟ ํ‚ค์™€ ์„ธ์…˜์— ๋Œ€ํ•ด ์•Œ์•„๋ณด์ž 1. ์ฟ ํ‚ค ๐Ÿช ์ฟ ํ‚ค๋Š” ํด๋ผ์ด์–ธํŠธ ์ธก์— ์ €

develop-const.tistory.com

 

Session๊ณผ JWT(Json Web Token)๋Š” ๋‘˜ ๋‹ค ์ธ์ฆ(Authentication) ๋ฐ ์ธ๊ฐ€(Authorization)์— ์‚ฌ์šฉ๋˜๋Š” ๋ฐฉ์‹์ž…๋‹ˆ๋‹ค. ํ•˜์ง€๋งŒ ๋‘ ๋ฐฉ์‹์€ ์‚ฌ์šฉ ๋ชฉ์ , ์ž‘๋™ ๋ฐฉ์‹, ์žฅ๋‹จ์  ๋“ฑ์—์„œ ์ฐจ์ด๊ฐ€ ์žˆ์Šต๋‹ˆ๋‹ค.

๐Ÿ’› Session 

Session์€ ์„œ๋ฒ„ ์ธก์—์„œ ์‚ฌ์šฉ์ž ์ƒํƒœ๋ฅผ ์œ ์ง€ํ•˜๊ณ  ์ธ์ฆ ์ •๋ณด๋ฅผ ์ €์žฅํ•˜๋Š” ๋ฐฉ์‹์ž…๋‹ˆ๋‹ค. ์‚ฌ์šฉ์ž๊ฐ€ ๋กœ๊ทธ์ธ์„ ํ•˜๋ฉด, ์„œ๋ฒ„๋Š” ์‚ฌ์šฉ์ž์˜ ์ธ์ฆ ์ •๋ณด๋ฅผ ์„ธ์…˜(Session)์— ์ €์žฅํ•˜๊ณ  ํ•ด๋‹น ์„ธ์…˜ ID๋ฅผ ํด๋ผ์ด์–ธํŠธ์—๊ฒŒ ์ „๋‹ฌํ•ฉ๋‹ˆ๋‹ค. ํด๋ผ์ด์–ธํŠธ๋Š” ์ดํ›„ ์„œ๋ฒ„์— ์š”์ฒญ์„ ๋ณด๋‚ผ ๋•Œ, ํ•ด๋‹น ์„ธ์…˜ ID๋ฅผ ํ•จ๊ป˜ ์ „์†กํ•˜์—ฌ ์„œ๋ฒ„๊ฐ€ ํ•ด๋‹น ์‚ฌ์šฉ์ž์˜ ์„ธ์…˜ ์ •๋ณด๋ฅผ ํ™•์ธํ•˜๊ณ  ์ธ์ฆ์„ ์ˆ˜ํ–‰ํ•˜๊ฒŒ ๋ฉ๋‹ˆ๋‹ค.

 

Session์˜ ์žฅ์ 

  • ๋ณด์•ˆ์„ฑ์ด ๋†’์Šต๋‹ˆ๋‹ค. ์ธ์ฆ ์ •๋ณด๋ฅผ ์„œ๋ฒ„ ์ธก์—์„œ ๊ด€๋ฆฌํ•˜๊ธฐ ๋•Œ๋ฌธ์—, ํด๋ผ์ด์–ธํŠธ์—์„œ ์กฐ์ž‘ํ•˜๊ฑฐ๋‚˜ ํƒˆ์ทจํ•˜๋Š” ๊ฒƒ์ด ์–ด๋ ต์Šต๋‹ˆ๋‹ค.
  • ์‚ฌ์šฉ์ด ์‰ฝ์Šต๋‹ˆ๋‹ค. ์„ธ์…˜์„ ์‚ฌ์šฉํ•˜๋ฉด ์„œ๋ฒ„ ์ธก์—์„œ ์ธ์ฆ ์ •๋ณด๋ฅผ ๊ด€๋ฆฌํ•˜๊ธฐ ๋•Œ๋ฌธ์—, ํด๋ผ์ด์–ธํŠธ์—์„œ ์ธ์ฆ ์ •๋ณด๋ฅผ ๋ณ„๋„๋กœ ๊ด€๋ฆฌํ•  ํ•„์š”๊ฐ€ ์—†์Šต๋‹ˆ๋‹ค.

Session์˜ ๋‹จ์ 

  • ์„œ๋ฒ„์˜ ๋ถ€ํ•˜๊ฐ€ ์ฆ๊ฐ€ํ•ฉ๋‹ˆ๋‹ค. ์‚ฌ์šฉ์ž๊ฐ€ ๋งŽ์•„์ง€๋ฉด, ์„œ๋ฒ„์—์„œ ์„ธ์…˜ ์ •๋ณด๋ฅผ ์œ ์ง€ํ•˜๊ธฐ ์œ„ํ•ด ๋งŽ์€ ์ž์›์ด ์†Œ๋ชจ๋ฉ๋‹ˆ๋‹ค.
  • ์„œ๋ฒ„์˜ ํ™•์žฅ์„ฑ์ด ๋–จ์–ด์ง‘๋‹ˆ๋‹ค. ์„œ๋ฒ„์—์„œ ์„ธ์…˜ ์ •๋ณด๋ฅผ ์œ ์ง€ํ•˜๊ธฐ ๋•Œ๋ฌธ์—, ์„œ๋ฒ„๋ฅผ ํ™•์žฅํ•˜๊ฑฐ๋‚˜ ๋ถ„์‚ฐ์‹œํ‚ค๋Š” ๊ฒƒ์ด ์–ด๋ ต์Šต๋‹ˆ๋‹ค. 

๐Ÿ’› JWT

JWT๋Š” ์ธ์ฆ ์ •๋ณด๋ฅผ JSON ํ˜•ํƒœ๋กœ ์•”ํ˜ธํ™”ํ•˜์—ฌ ํ† ํฐ(Token)์œผ๋กœ ๋งŒ๋“  ๋‹ค์Œ, ํ•ด๋‹น ํ† ํฐ์„ ํด๋ผ์ด์–ธํŠธ์—๊ฒŒ ์ „๋‹ฌํ•˜๋Š” ๋ฐฉ์‹์ž…๋‹ˆ๋‹ค. JWT ํ† ํฐ์—๋Š” ์‚ฌ์šฉ์ž์˜ ์ธ์ฆ ์ •๋ณด๋ฟ๋งŒ ์•„๋‹ˆ๋ผ, ํ•„์š”ํ•œ ์ถ”๊ฐ€ ์ •๋ณด(ํด๋ ˆ์ž„(Claim))๋„ ํ•จ๊ป˜ ํฌํ•จ๋  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ํด๋ผ์ด์–ธํŠธ๊ฐ€ ์„œ๋ฒ„์— ์š”์ฒญ์„ ๋ณด๋‚ผ ๋•Œ, ํ•ด๋‹น JWT ํ† ํฐ์„ ํ•จ๊ป˜ ์ „์†กํ•˜์—ฌ ์„œ๋ฒ„๊ฐ€ ํ•ด๋‹น ์‚ฌ์šฉ์ž์˜ ์ธ์ฆ ์ •๋ณด๋ฅผ ํ™•์ธํ•˜๊ณ  ์ธ๊ฐ€๋ฅผ ์ˆ˜ํ–‰ํ•˜๊ฒŒ ๋ฉ๋‹ˆ๋‹ค.

 

JWT์˜ ์žฅ์ 

  • ์„œ๋ฒ„์˜ ๋ถ€ํ•˜๊ฐ€ ์ ์Šต๋‹ˆ๋‹ค. JWT๋Š” ํด๋ผ์ด์–ธํŠธ์—์„œ ์ธ์ฆ ์ •๋ณด๋ฅผ ๊ด€๋ฆฌํ•˜๊ธฐ ๋•Œ๋ฌธ์—, ์„œ๋ฒ„์—์„œ ์„ธ์…˜ ์ •๋ณด๋ฅผ ์œ ์ง€ํ•  ํ•„์š”๊ฐ€ ์—†์Šต๋‹ˆ๋‹ค.
  • ์„œ๋ฒ„์˜ ํ™•์žฅ์„ฑ์ด ๋†’์Šต๋‹ˆ๋‹ค. JWT๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด, ํด๋ผ์ด์–ธํŠธ์—์„œ ์ธ์ฆ ์ •๋ณด๋ฅผ ๊ด€๋ฆฌํ•˜๊ธฐ ๋•Œ๋ฌธ์— ์„œ๋ฒ„๋ฅผ ํ™•์žฅํ•˜๊ฑฐ๋‚˜ ๋ถ„์‚ฐ์‹œํ‚ค๋Š” ๊ฒƒ์ด ์šฉ์ดํ•ฉ๋‹ˆ๋‹ค.

JWT์˜ ๋‹จ์ 

  • ๋ณด์•ˆ์„ฑ์ด ๋‚ฎ์„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. JWT๋Š” ํด๋ผ์ด์–ธํŠธ์—์„œ ์ธ์ฆ ์ •๋ณด๋ฅผ ๊ด€๋ฆฌํ•˜๊ธฐ ๋•Œ๋ฌธ์—, ํด๋ผ์ด์–ธํŠธ์—์„œ ํ† ํฐ์„ ์กฐ์ž‘ํ•˜๊ฑฐ๋‚˜ ํƒˆ์ทจํ•˜๋Š” ๊ฒƒ์ด ๊ฐ€๋Šฅํ•ฉ๋‹ˆ๋‹ค. ์ด๋Ÿฌํ•œ ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•˜๊ธฐ ์œ„ํ•ด, JWT๋Š” ํ† ํฐ์„ ์•”ํ˜ธํ™”ํ•˜์—ฌ ๋ณด์•ˆ์„ฑ์„ ๊ฐ•ํ™”ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
  • ์‚ฌ์šฉ์ด ๋ณต์žกํ•ฉ๋‹ˆ๋‹ค. JWT๋Š” ์„œ๋ฒ„์™€ ํด๋ผ์ด์–ธํŠธ ๋ชจ๋‘์—์„œ ์ธ์ฆ ์ •๋ณด๋ฅผ ๊ด€๋ฆฌํ•ด์•ผ ํ•˜๊ธฐ ๋•Œ๋ฌธ์—, ๊ตฌํ˜„ํ•˜๊ธฐ๊ฐ€ ์–ด๋ ค์šธ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

 

์–ด๋–ค๋ฐฉ์‹์„ ์‚ฌ์šฉํ• ์ง€๋Š” ์‚ฌ์šฉ ๋ชฉ์ ๊ณผ ์š”๊ตฌ์‚ฌํ•ญ์— ๊ฒฐ์ •๋˜์ง€๋งŒ ๋ณด์•ˆ์ด ์ค‘์š”ํ•œ ๊ฒฝ์šฐ Session์„ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ด ์ข‹๊ณ , ์„œ๋ฒ„์˜ ๋ถ€ํ•˜๋ฅผ ์ค„์ด๊ณ  ํ™•์žฅ์„ฑ์„ ๋†’์ด๋Š” ๊ฒƒ์ด ์ค‘์š”ํ•œ ๊ฒฝ์šฐ JWT๋ฅผ ์‚ฌ์šฉํ•˜๋Š” ๊ฒƒ์ด ์ ํ•ฉํ•ฉ๋‹ˆ๋‹ค. Session๊ณผ JWT๋ฅผ ํ•จ๊ป˜ ์‚ฌ์šฉํ•˜๋Š” ๋ฐฉ๋ฒ•๋„ ์žˆ์œผ๋ฉฐ, ์ด๋ฅผ hybird๋ฐฉ์‹์ด๋ผ๊ณ  ํ•ฉ๋‹ˆ๋‹ค.

๐Ÿ•ถ JWT๊ตฌ์กฐ

JWTํ† ํฐ์˜ ๊ตฌ์กฐ๋ฅผ ํ™•์ธํ•ด๋ณด๊ณ ์‹ถ๋‹ค๋ฉด  ์•„๋ž˜์˜ ์‚ฌ์ดํŠธ๋ฅผ ๋“ค์–ด๊ฐ€์„œ ์ง์ ‘ ๋งŒ๋“ค์–ด๋ณด์„ธ์š”๐ŸŒž

https://jwt.io/#debugger-io

 

JWT.IO

JSON Web Tokens are an open, industry standard RFC 7519 method for representing claims securely between two parties.

jwt.io

 

[header].[payload].[signature]

 

[Header]

Header JWT ํ† ํฐ์˜ ํ—ค๋”์—๋Š” ๋‘ ๊ฐ€์ง€ ์ •๋ณด๊ฐ€ ํฌํ•จ๋ฉ๋‹ˆ๋‹ค. ์ฒซ ๋ฒˆ์งธ๋Š” ํ† ํฐ์ด ์–ด๋–ค ์ข…๋ฅ˜์˜ ํ† ํฐ์ธ์ง€๋ฅผ ๋‚˜ํƒ€๋‚ด๋Š” "typ"์ด๋ผ๋Š” ํ•„๋“œ์ด๊ณ , ๋‘ ๋ฒˆ์งธ๋Š” ์‚ฌ์šฉ๋œ ์•”ํ˜ธํ™” ์•Œ๊ณ ๋ฆฌ์ฆ˜์„ ๋‚˜ํƒ€๋‚ด๋Š” "alg"๋ผ๋Š” ํ•„๋“œ์ž…๋‹ˆ๋‹ค. ์ด๋Ÿฌํ•œ ์ •๋ณด๋“ค์€ Base64๋กœ ์ธ์ฝ”๋”ฉ๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค.

const header = {
  alg: "HS256",
  typ: "JWT",
}

[Payload]

Payload JWT ํ† ํฐ์˜ ํŽ˜์ด๋กœ๋“œ์—๋Š” ์‚ฌ์šฉ์ž ์ •๋ณด์™€ ๊ฐ™์€ ํด๋ ˆ์ž„(claim) ์ •๋ณด๋“ค์ด ๋“ค์–ด๊ฐ‘๋‹ˆ๋‹ค. ํด๋ ˆ์ž„ ์ •๋ณด๋Š” ์ด๋ฆ„๊ณผ ๊ฐ’์œผ๋กœ ๊ตฌ์„ฑ๋˜์–ด ์žˆ์œผ๋ฉฐ, JWT์—์„œ๋Š” ๋ฏธ๋ฆฌ ์ •์˜๋œ ์„ธ ๊ฐ€์ง€ ์ข…๋ฅ˜์˜ ํด๋ ˆ์ž„์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ด๋“ค์€ registered, public, private ํด๋ ˆ์ž„์ด๋ฉฐ, ๊ฐ๊ฐ์˜ ํด๋ ˆ์ž„์€ ๋‹ค์–‘ํ•œ ์ •๋ณด๋ฅผ ๋‹ด์„ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. Payload ์—ญ์‹œ Base64๋กœ ์ธ์ฝ”๋”ฉ๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค.

const payload = {
  id: 4
  email: "2_4_3_1@gmail.com",
  role: "admin",
}

[Signature] ์•”ํ˜ธ์™€ ๋ฐฉ๋ฒ•

Signature JWT ํ† ํฐ์˜ ์‹œ๊ทธ๋‹ˆ์ฒ˜๋Š” Header์™€ Payload๋ฅผ ํ•ฉ์ณ์„œ ์•”ํ˜ธํ™”ํ•˜๋Š”๋ฐ ์‚ฌ์šฉ๋ฉ๋‹ˆ๋‹ค. ์•”ํ˜ธํ™” ์•Œ๊ณ ๋ฆฌ์ฆ˜์€ Header์—์„œ ์ง€์ •๋œ ์•Œ๊ณ ๋ฆฌ์ฆ˜์„ ๋”ฐ๋ฆ…๋‹ˆ๋‹ค. ์ด๋Ÿฌํ•œ Signature๋Š” ํ—ค๋”์™€ ํŽ˜์ด๋กœ๋“œ๊ฐ€ ์กฐ์ž‘๋˜์ง€ ์•Š์•˜๋‹ค๋Š” ๊ฒƒ์„ ๊ฒ€์ฆํ•˜๋Š” ์—ญํ• ์„ ํ•ฉ๋‹ˆ๋‹ค.

HMACSHA256(
  base64UrlEncode(header) + "." +
  base64UrlEncode(payload),
  
your-256-bit-secret

)

์ง์ ‘ jwtํ† ํฐ์„ ๋งŒ๋“œ๋Š”๋ฐฉ๋ฒ•์„ ๊ตฌํ˜„ํ•˜๋Š”๋ฐฉ๋ฒ•๋„ ์žˆ์ง€๋งŒ ์š”์ฆ˜์—๋Š” JWT ์ƒ์„ฑํ•˜๋Š” ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๊ฐ€ ๋งŽ์ด ์กด์žฌํ•˜๋‹ˆ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ๊ฐ„๋‹จํ•˜๊ฒŒ JWT ํ† ํฐ์„ ๊ตฌํ˜„ํ•˜๋ฉด๋œ๋‹ค. ์˜ˆ๋ฅผ๋“ค์–ด npm์— jsonwebtoken์ด ์žˆ์œผ๋‹ˆ ์ด๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ํ† ํฐ์„ ์‰ฝ๊ฒŒ ๊ตฌํ˜„ํ•˜๋ฉด ๋œ๋‹ค.

๐Ÿ’” JWT ํ† ํฐ์˜ ๋‹จ์ 

JWT ํ† ํฐ์˜ ๋งŒ๋ฃŒ ๋ฐ ๊ฐฑ์‹ ์€ JWT์˜ ๋‹จ์  ์ค‘ ํ•˜๋‚˜์ž…๋‹ˆ๋‹ค. JWT์˜ ํ† ํฐ์€ ์ผ๋‹จ ๋ฐœ๊ธ‰๋˜๋ฉด ๋งŒ๋ฃŒ ์ „๊นŒ์ง€๋Š” ์œ ํšจํ•˜๊ธฐ ๋•Œ๋ฌธ์—, ๋งŒ๋ฃŒ ์ „์— ํ† ํฐ์„ ์žƒ์–ด๋ฒ„๋ฆฌ๊ฑฐ๋‚˜ ํƒˆ์ทจ๋‹นํ•  ๊ฒฝ์šฐ ๋ณด์•ˆ ๋ฌธ์ œ๊ฐ€ ๋ฐœ์ƒํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

 

์ด๋ฅผ ํ•ด๊ฒฐํ•˜๊ธฐ์œ„ํ•œ๋ฐฉ๋ฒ•์œผ๋กœ Refresh Token ๋ฐฉ์‹์ด ์žˆ์Šต๋‹ˆ๋‹ค.

Refresh Token ๋ฐฉ์‹์€ access token๊ณผ ๋ณ„๋„๋กœ ๋ฐœ๊ธ‰๋˜๋Š” Refresh Token์„ ์ด์šฉํ•˜์—ฌ access token์˜ ๋งŒ๋ฃŒ์‹œ๊ฐ„์ด ์ง€๋‚˜๊ฐ”์„ ๊ฒฝ์šฐ Refresh Token์„ ์‚ฌ์šฉํ•˜์—ฌ access token์„ ๊ฐฑ์‹ ํ•˜๋Š” ๋ฐฉ์‹์ž…๋‹ˆ๋‹ค. Refresh Token์€ access token๋ณด๋‹ค ๋” ๊ธด ์œ ํšจ๊ธฐ๊ฐ„์„ ๊ฐ€์ง€๋ฉฐ, access token ๋งŒ๋ฃŒ์‹œ Refresh Token์„ ์‚ฌ์šฉํ•˜์—ฌ access token์„ ์žฌ๋ฐœ๊ธ‰ํ•ฉ๋‹ˆ๋‹ค. ์ด ๋ฐฉ์‹์„ ์‚ฌ์šฉํ•˜๋ฉด access token์˜ ์œ ํšจ๊ธฐ๊ฐ„์ด ๊ธธ์–ด์ง€๋Š” ๊ฒƒ์„ ๋ฐฉ์ง€ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ํ•˜์ง€๋งŒ Refresh Token์ด ํƒˆ์ทจ๋‹นํ•  ๊ฒฝ์šฐ ๋ณด์•ˆ ๋ฌธ์ œ๊ฐ€ ๋ฐœ์ƒํ•  ์ˆ˜ ์žˆ์œผ๋ฏ€๋กœ, ์ ์ ˆํ•œ ๊ด€๋ฆฌ๊ฐ€ ํ•„์š”ํ•ฉ๋‹ˆ๋‹ค.

 

๐Ÿ˜ƒ๋‹ค์Œ ํŽ˜์ด์ง€์—์„œ Refresh Token ๊ณผ access token์— ๋Œ€ํ•ด ์•Œ์•„๋ด…์‹œ๋‹ค ๐Ÿ˜ƒ