Web

JWT, NodeJS와 React를 통해 구현해보기 (1)

songye 2024. 6. 28. 17:52

What is JWT

JWT(Jason web token)은 웹에서 특정 정보를 안전하게 사용하기 위한 방법 중 하나입니다.

 

JWT는 JSON 포맷을 사용하여 정보를 주고 받을 수 있으며

크게 인증과 교환 두 가지 매커니즘이 있습니다.

 

일반적으로 로그인 세션을 유지하기 위한 방법으로 사용됩니다.

토큰을 통한 인증으로 특정 정보에 접근 및 권한이 주어지게 됩니다.

Scenario

(1) 사용자가 회원가입된 정보로 Login을 시도 합니다. 이 때 Server는 DB에 저장된 ID 및 PW 정보를 조회합니다.

(2) 만약 사용자 정보가 확인되면 SecretKey를 통해 암호화된 Token을 클라이언트에게 발급합니다

(이 때 localStorage 혹은 Cookie에 저장하는 다양한 방법이 있습니다)

(3) 권한이 필요한 정보 혹은 페이지를 요청할 때 Token을 같이 보내어 검증을 받습니다. Secret Key로 복호화하여 검증합니다.

(4) 검증이 확인되면 사용자가 요청한 권한 요청을 수행합니다.

JWT Structure

  • HEADER, JWT의 타입과 사용하는 해싱 알고리즘을 포함
  • PAYLOAD, 실제로 전송하는 정보를 담고 있는 부분 (BODY라 생각하면 쉽다 보통 권한 및 ID 소지)
  • SECRETKEY, 데이터를 암호화하고 복호화 하는 데 사용 절대 노출 금지,,!

Refresh Token, Access Token

  • 만약 해커가 Token을 탈취하고 발급받은 토큰의 유효기간이 길다면 오랜시간 정보가 탈취될 위험성이 있기 때문에 Refresh 토큰을 사용합니다.
  • Refresh 토큰은 직접적으로 권한을 요청하는데 사용되지 않고 Access 토큰을 재발급되는데 사용됩니다.
  • Access 토큰은 위에서 봤던 것처럼 직접적인 인증에 사용됩니다. 만약 토큰이 만료됐을 경우 Refresh Token을 통해 재발급 받으며 유효기간이 짧아 탈취를 당해도 오랜시간 위험에 노출되지 않을 수 있습니다.
  • Refresh Token은 Cookie(http Only Option)로 사용하여 악의적인 Script 공격으로부터 방어를 할 수 있습니다.

기존 JWT 방식과 다른 점을 살펴봅시다.

(1) Access Token 정상 인증 완료, 이 때는 요청한 정보나 권한을 올바르게 줍니다.

(2) Access Token 이 만료된 경우 Refresh 토큰을 검증하여 만약 Refresh Token이 인증될 경우 Access 토큰을 재발급합니다.

(3) Refresh Token까지 만료된 경우 사용자는 재로그인을 해야합니다!

장점

  • 인증 정보를 서버가 가지고 있지 않아도 됩니다. 이 말은 즉슨 검사할 수 있는 Secret Key만 있으면 클라이언트가 가져오는 Token을 검사만 해주면된다는 소리! 개꿀
  • 이말은 즉슨 Query를 할 필요도 없고 그저 요청 받아 바로 응답할 수 있다는 것, 속도, 용량 측면에서 서버 부하를 줄일 수 있습니다.

단점

  • 토큰이 커지면 네트워크에 부하가 걸릴 수 있습니다. 인코딩한 정보를 주고 받기 때문에 네트워크 트래픽이 걸릴 수 있다는 단점, 주고 받아야할 패킷이 많아질 수 있다는 거겠죠!

마무리

생에 첫 로그인 및 세션 유지를 구현하고 있습니다. 쉽지 않은 과정이지만 재밌는 과정입니다.

(쿠당탕탕 몸으로 직접 부딪혔다 아프다)

오늘은 이론을 바탕으로 알아봤으니

다음에는 Node.js와 React를 통해 구현해보고 실습해봅시다!