프론트에서 안전하게 로그인 처리하기

보안에 위협이 되는 문제

1. XSS (Cross Site Scriptiong)

공격자가 <input>태그나 url등에 Javascript를 삽입해 실행되도록 공격한다.

악성데이터를 실행하거나 사이트의 전역 변수를 이용해 API 요청을 하여 사이트의 로직인 척 행동하여 악의적인 행동을 한다.

 

2. CSRF (Cross Site Request Forgery)

서버에서 클라이언트 도메인을 통제하고 있지 않으면 공격자가 다른 사이트에서 API 요청을 할 수 있다.

이때 공격자가 사용자만이 가능한 행위(수정, 삭제, 등록 등)들을 할 수 있다.

(이러한 행위로인해 최악의 상황 -> 비밀번호, 송금 등에 접근)

 

원본 글 요약

  • JWT(JSON Web Token)로 유저 인증
  • Refresh Token은 httpOnly
  • Access Token은 JSON payload
  • Access Token은 지역변수로 저장
  • 새로고침이나 브라우저 종료 후 재접속(mount) 처리, 각각의 API 이용 
    • 최초 접근 API
    • 재 접근 API
  • 재 접근 시 Refresh Token과 Access Token을 새로 발급 받을 수 있도록 한다.
  • CSRF, XSS 공격에서 다소 안전하나 XSS는 어떤식으로든 취약점이 생길 수 있어 서버에서도 같이 처리 필요

 

이미지 출처 원본글

 

Access Token, Refresh Token이란?

  • OAuth(Open Auth)에서 나온 개념이며 두개를 묶어 사용자 토큰이라고 부른다.
  • Access Token은 보안상 짧은 유효기간, Refresh Token은 긴 유효기간을 가지고 있다.
  • Access Token이 만료되면 Refresh Token을 통해 Access Token을 갱신한다.
  • 왜 두개가 필요한지에 대해서는 Stack overflow 글 참고 하면 되고 참고 링크에서도 확인가능하다.
  • 보안상 두가지를 사용하는 것으로 이해하면된다.

-참고 https://dreamaz.tistory.com/22

 

Access Token과 Refresh Token이란 무엇인가?

안녕하세요. 개발자 드리머즈입니다.    [카카오 아이디로 로그인하기]에서나.. 네이버, 페이스북을 통한 로그인 시에 access token과 refresh token에 관한 내용을 들을 수 있습니다. 대충 뭐하는 녀��

dreamaz.tistory.com

 

보안관련 작업을 해본적도 관심도 없었던 나에게 보안에 얕게나마 관심을 가지게해주는 좋은 글이었다.

 

 


 

원본 글

https://velog.io/@yaytomato/%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%90%EC%84%9C-%EC%95%88%EC%A0%84%ED%95%98%EA%B2%8C-%EB%A1%9C%EA%B7%B8%EC%9D%B8-%EC%B2%98%EB%A6%AC%ED%95%98%EA%B8%B0

 

+ Recent posts