본문 바로가기

프론트엔드

30. Token, XSS, CSRF

Token

토큰이란 서버가 각각의 클라이언트를 누군지 정확히 구별할 수 있도록 유니크한 정보를 담은 암호화 데이터로 유저 구별이 가능해서 그 유저에 맞는 기능과 권한을 제공할 수 있도록 해줍니다.

 

JWT:Json Web Token

JWT 토큰으로 유저 정보를 담은 객체를 문자열로 만들고 암호화시켜서 키를 브라우저에 주고 부라우저 저장소에 저장되있다가 유저의 정보가 필요한 API를 사용할 때 부내주게 되면 해당 키를 백엔드에서 복호화해서 사용자를 식별한 후 접근이 가능하도록 한다. 그래서 이 토큰을 탈취할 경우 위험하기 때문에 대부분 토큰의 유효기간이 있다.

 

 

XSS 공격(크로스 사이트 스크립트)

위의 코드에서 dangerouslySetInnerHTML은 태그 형태의 입력을 태그로 만들어서 실행을 하게 되는데 여기서 문제가 생긴다. 바로 입력칸에 script 태그를 넣어 그 스크립트에 있는 함수에 해킹 코드를 넣어 실행되는 방식으로 해킹이 이뤄지게 됩니다. 이러한 공격을 XSS(크로스 사이트 스크립트)라고 부릅니다. 이를 막아주는 라이브러리로 대표적인 것이 DOMpurify가 있습니다.

https://www.npmjs.com/package/dompurify

 

dompurify

DOMPurify is a DOM-only, super-fast, uber-tolerant XSS sanitizer for HTML, MathML and SVG. It's written in JavaScript and works in all modern browsers (Safari, Opera (15+), Internet Explorer (10+), Firefox and Chrome - as well as almost anything else usin.

www.npmjs.com

위의 코드도 이 DOMpurify를 통해서 이 문제를 해결하고 있습니다.

 

CSRF 공격(크로스 사이트 리퀘스트 포저리)

웹 어플리케이션의 취약점 중 하나로 인터넷 사용자의 의도와 상관 없이 공격자가 의도한 행동 예를 들어 데이터의 수정이나 삭제 등록 등을 강제로 하도록 만드는 공격입니다.

 

공격 방법

1. 이용자가 로그인해서 웹사이트에서 정상적인 쿠키를 발급받는다.

2. 공격자는 링크를 이메일나 게시판 등으로 이용자에게 전달한다.

3. 그 링크로 들어가면 공격용 스크립트가 포함된 URL을 연다.

 

 

'프론트엔드' 카테고리의 다른 글

32. Promise.all()  (0) 2023.05.01
31. Memoization  (0) 2023.05.01
28. Recrusive Function  (0) 2023.04.23
27. Callback, Promise  (0) 2023.04.23
21. useEffect  (0) 2023.04.08