티스토리 뷰

728x90
반응형

출처 : http://xss-game.appspot.com/level1

 

첫 번째 단계의 목표는 alert 창을 띄우는 것이 끝이다. alert 창이라 함은 결국 javascript의 alert() 함수를 의미하겠다.

우선 유일하게 보이는 input의 입력란에 임의의 내용을 입력하고 Search 버튼을 눌러본다.

 

 

임의의 내용인 "hello there"을 작성하구서, Search 버튼을 누르면 아래와 같이 나온다.

 

 

"hello there" 라는 문자열이 우리가 입력한 그대로 출력됨을 알 수 있다. 소스보기로 다시 보면 아래와 같다.

그럼 저곳에 script 를 넣게 되면 HTML이 렌더링되면서 alert() 창이 팝업되지 않을까? 내용을 다시 입력하고 Search 버튼을 누르면 아래와 같이 코드가 삽입(inject)되고, 아래 이미지처럼 성공적으로 단계를 마쳤다고 alert 메시지가 추가로 나온다.

 

 

참고사항 : 우리가 의도한 alert 창은 alert(1) 이므로 아래와 같은 형태가 나와야 하는데, 어째서 Congraturation ... 어쩌구 내용이 같이 나왔던 것일까? 

 

 

그 비밀은 아래 소스코드의 /static/game-frame.js 파일에서 확인할 수 있다. 아래 소스코드는 level1의 소스코드의 iframe 태그의 내용이다.

 

 

아래는 /static/game-frame.js 파일의 내용이다. 보시다시피 alert 함수를 재정의 하고 있다. 간단히 해석하면, 기존의 alert 함수를 그대로 사용하되, alert 함수로 넘긴 파라미터는 s 로 하고, s 변수 앞 뒤로 문자열들을 추가해서 alert 창을 띄워주게끔 되어 있다. 그래서 예를 들어 우리가 alert("hello") 라고 했다면, "Congratulations, you exected an alert:\n\n hello \n\n You can now advance to the next level." 이라고 alert 창이 나왔을 것이다.

그럼 parent.postMessage("success", "*")는 무엇이냐? 저건 사실 그냥 다음 단계로 넘어갈 수 있게 해주는 버튼을 만들어주는 역할이다. 그래서 사실 개발자 도구 console에 해당 코드를 입력해서 전송하면, 바로 다음 단계로 넘어갈 수 있는 버튼이 생성되긴 한다. 물론 그렇게 해서는 XSS game 문제의 의도에서 벗어나지만 말이다.

/* If we're being iframed, let the parent know our URL */
/* Kids: don't do this at home! */
parent.postMessage(window.location.toString(), "*");

/* Override window.alert */
var originalAlert = window.alert;
window.alert = function(s) {
  parent.postMessage("success", "*");
  setTimeout(function() { 
    originalAlert("Congratulations, you executed an alert:\n\n" 
      + s + "\n\nYou can now advance to the next level.");
  }, 50);
}

 

 

- 끝 -

728x90
반응형
댓글