본문 바로가기
Research/React

로컬 스토리지, 쿠키로 토큰 저장 시 리스크 차이

by RIEM 2023. 11. 2.

웹에서 클라이언트가 토큰을 사용하는 방법은 2가지, 1) localStorage | sessionStorage에 담아서 사용하는 방법, 2) 쿠키에 저장하는 방법이다. 둘 다 브라우저를 통해 사용한다.

localstorage | sessionStorage로 토큰 저장

localStorage, sessionStorage 으로 토큰 사용 시 장점은 구현과 사용이 쉽다. 

단점은 XSS(Cross Site Scripting)에 취약하다. 페이지에 악성 스크립트를 삽입해서 토큰 탈취가 가능하기 때문이다.

쿠키로 토큰 저장

쿠키 또한 XSS 문제가 발생할 수 있으나, httpOnly 속성 활성화로 막을 수 있다. 이로 인해 자바스크립트로 쿠키 조회가 불가능해지기 때문에 악성 스크립트로부터 안전하다. 단, CSRF(Cross Site Request Forgery) 공격에 취약해진다. CSRF 공격은 요청 시 쿠키가 항상 전달되는 점을 이용해 원치 않은 API에 추가로 요청하도록 한다. 예를 들어 나도 모르게 글을 작성한다는지 등 말이다.

CSRF 공격을 막기위해 CSRF 토큰 사용하거나 Referer 검증으로 막을 수 있다.

출처

책 <리액트를 다루는 기술> VELOPERT 지음, 길벗 출판

'Research > React' 카테고리의 다른 글

React-speech-kit 사용하기  (0) 2023.11.08
React_참고_여러 input들 데이터 종합하기  (0) 2023.11.05
React_간단한 비동기 api 만들기  (0) 2023.10.30
React_redirect 하기  (0) 2023.10.30
React_NotFound 페이지 만들기  (0) 2023.10.30

댓글