[TIL] JWT 로그인 구현과 보안

• 용어정리

  • XSS 공격: 사이트 내에 HTML에 자바스크립트를 삽입하는 공격. 로그인 과정에서 이를 통해 사용자 토큰을 갈취할 수도 있음
  • CSRF 공격: 정말 유사한 다른 사이트를 만들어서 이용자를 속임. 로그인 과정에서 이를 통해 토큰을 갈취할 수 있음

• REST API를 통해 사이트를 구현할 때, JWT 인증 방식을 구현하고 이를 브라우저에 저장하는 방식은 크게 두가지가 있음

  • 1번: 토큰을 로컬 스토리지에 저장
  • 2번: 토큰을 쿠키에 저장 (httponly)
  • 1번의 경우에는 XSS 공격의 위험에 노출됨
  • 2번의 경우에는 XSS 공격에는 안전하지만 CSRF 공격의 위험에 노출됨 (단, httponly 속성이 true가 아닌 경우에는 XSS 공격에 취약함

• 하지만, CSRF 공격을 막을 수 있는 방법이 있음

  1. 쿠키의 samesite 속성을 Lax 이상으로 설정 → 단, 해당 속성을 지원하지 않는 브라우저가 존재함
  2. CORS로 가능한 도메인 설정 → 단, CORS는 브라우저 정책을 신뢰하는 것이므로 모든 브라우저를 100% 신뢰하기는 어려움
  3. CSRF 토큰 (csrf 토큰을 함께 발행해서, access 토큰과 함께 검사) → 가장 안전한 방법으로 판단됨

• 다른 곳은 어떻게 하는지 살펴봤다. (생각나는 곳만)

  1. Notion

     
     • 쿠키에 토큰을 저장함
     • csrf 토큰 값을 따로 주지는 않는 것 같음
     • samesite 속성도 따로 주진 않음
     • 아마 CORS를 통해 방어하지 않을까?

  2. Velog

     
     • 쿠키에 토큰을 저장함
     • csrf 토큰 값을 따로 주지는 않는 것 가음
     • samesite 속성도 따로 주진 않음
     • 아마 CORS를 통해 방어하지 않을까?

  3. 클래스101

     
     • Header에서 Authorization Bearer로 토큰을 던지는 거 보니 js에서 접근 가능할 거 같긴 한데, 로컬 스토리지나 쿠키를 찾아봐도 보이진 않는다.

# 참고한 곳

• Access Token 저장 위치에 대한 고찰
• CSRF 공격이란? 그리고 CSRF 방어 방법