웹브라우저 및 Node.js 에서 XSS 공격 막기

XSS (Cross-Site Scripting 크로스 사이트 스크립팅) 은 사용자가 입력할 수 있는 폼이나

URL의 파라미터 값을 통해 악의적인 코드를 삽입하여

쿠키를 갈취하거나 악성 코드를 실행하는 것을 말합니다.

사이트 간 스크립팅(또는 크로스 사이트 스크립팅, 영문 명칭 cross-site scripting, 영문 약어 XSS)은 웹 애플리케이션에서 많이 나타나는 취약점의 하나로 웹사이트 관리자가 아닌 이가 웹 페이지에 악성 스크립트를 삽입할 수 있는 취약점이다.
주로 여러 사용자가 보게 되는 전자 게시판에 악성 스크립트가 담긴 글을 올리는 형태로 이루어진다.
이 취약점은 웹 애플리케이션이 사용자로부터 입력 받은 값을 제대로 검사하지 않고 사용할 경우 나타난다.
이 취약점으로 해커가 사용자의 정보(쿠키, 세션 등)를 탈취하거나, 자동으로 비정상적인 기능을 수행하게 하거나 할 수 있다.
주로 다른 웹사이트와 정보를 교환하는 식으로 작동하므로 사이트 간 스크립팅이라고 한다.

사이트 간 스크립팅 - Wikipedia

기본적으로 이는 태그, 특히 스크립트 태그를 통해 삽입되어 지는데요.

태그를 여는 < 를 < 로 > 를 > 로 표현함으로써

브라우저가 진짜 태그가 아닌 문자 형태의 < 와 > 로 인식하게 할 수 있습니다.

이 방법으로 XSS 필터링을 해줄 수 있습니다.

function XSSFilter(content) {
  return content.replace(/</g, "<").replace(/>/g, ">");
}

기본 원리는 이와 같이 실제 태그가 아닌 문자로 변경해줌으로써 태그나 코드를 주입 못하게 하는 것인데요.
사실 저 2개만으로는 XSS 공격을 제대로 막기에는 좀 부족합니다.

실제로 좀 더 확실한 방법으로 필터링 하고자 한다면 기존에 있는 오픈소스를 이용하는 것이 좋습니다.

여기서 저는 js-xss 라는 오픈소스를 선택하였습니다.
GitHub: https://github.com/leizongmin/js-xss

Browser

<script src="https://cdnjs.cloudflare.com/ajax/libs/js-xss/0.3.3/xss.min.js"></script>
<script>
var html = filterXSS('<script>alert("xss");</scr' + 'ipt>');
alert(html);
</script>

Node.js

var xss = require('xss');
var html = xss('<script>alert("xss");</script>');
console.log(html);

Node.js 의 장점이 Front-end와 Back-end 언어가 같다는 점을 생각하면

이 코드는 HTML + CSS + JavaScript 또는 Node.js 양쪽 모두에서 동일하게 사용할 수 있습니다.

참고블로그 : https://steemkr.com/technology/@inspiredjw/node-js-xss