A ship in harbor is safe, but that is not what ships are built for.

STUDY/WEB_Hacking

Webhacking.kr 54번 문제(old)

플리피나리 2021. 1. 25. 01:22
반응형

문제부터 확인했다.

 

위와 같이 Password is 라고 나오고 뒤에 막 여러 문자가 나오다가 ?가 나오면서 멈췄다.

일단 소스코드부터 확인해보자.

 

뭔가 짧다... 일단 하나하나 확인해보자.

 

<html>

<head>

<title>Challenge 54</title>

</head>

<body>

<h1><b>Password is <font id=aview></font></b></h1>   //Password is 다음 문자열을 aview라고 id 지정

<script>

function run(){           //비동기 통신 처리를 위한 XMLHttpRequest 객체 구하는 함수 정의

   if(window.ActiveXObject){     //브라우저가 IE일 경우 ActiveXObject( )로 XMLHttpRequest 객체 구하기

      try {

          return new ActiveXObject('Msxml2.XMLHTTP');         

       } catch (e) {

           try {

               return new ActiveXObject('Microsoft.XMLHTTP');

           } catch (e) {

               return null;

           }

       }         //IE 이외 브라우저에서 XMLHttpRequest( )로 XMLHttpRequest 객체 구하기

   }else if(window.XMLHttpRequest){  

       return new XMLHttpRequest();

   }else{

       return null;

   }

}

x=run();   //x는 생성된 객체

function answer(i){

       x.open('GET','?m='+i,false);    //get 방식으로 해당 서버에 동기 통신 방식으로 연결

       x.send(null);     

       aview.innerHTML=x.responseText;  //aview 부분을 서버에서 정달받은 데이터로 출력

       i++;

       if(x.responseText)          //서버에서 전달받은 데이터가 있다면 

            setTimeout("answer("+i+")",20);    //20밀리세컨드 후 재귀함수 호출

       if(x.responseText=="")      //서버에서 전달받은 데이터가 공백, 즉 끝이라면

            aview.innerHTML="?";      // aview에 ?를 출력

}

setTimeout("answer(0)",1000);     //1000밀리세컨드 후 answer(0) 함수를 실행

</script>

</body>

</html>

 

※ 동기식 vs 비동기식

1) 동기식 방식 : 요청과 결과로 이루어지는 실행 흐름의 단위가 맞아 떨어지는 방식 >> 요청과 결과가 순차적으로 이루어진다. (A요청 -> A응답 -> B요청 -> B응답 -> C요청 -> C응답)

2) 비동기식 방식 : 요청과 결과로 이루어지는 실행 흐름의 단위가 맞춰지지 않는다. >> 요청과 결과가 뒤죽박죽

(A요청 -> B 요청 -> A응답 -> C요청 ...)

>> x.open 부분에서 순차적으로 응답과 요청을 받기 위해 동기 통신을 선택한 것. 만약 비동기식 방식이라면 FLAG 값이 뒤죽박죽 올 것이다.

 

※ XMLHttpRequest 객체

초기에 웹 브라우저가 데이터를 요청하면 서버는 해당 정보를 통째로 보내주어야 했다. 이런 방식은 불필요한 부분까지 계속 새로 페이지로 그려야 한다는 치명적 단점이 있다. 따라서 특정부분만(혹은 필요한 양만큼만) 비동기적으로 데이터를 가져와서 변경하는 방법이 대두되었으니 그렇게 탄생한 것이 Asynchronous JavaScript and XML, 즉 Ajax 이다. XMLHttpRequest 객체는 JavaScript가 이를 위해 사용하는 객체로 웹 서버에 HTTP 또는 HTTPS 방식으로 요청을 전송하고, 결과를 수신한다.

 

※ 기타

open('Http Method', 'Server URL', '비동기 통신 유무') : Http Method에 GET 또는 POST를 정의하여 통신 방식을 정하고 통신 방식에 따라 Server URL에 쿼리스트링 방식으로 데이터를 전달한다. 3번째 인자가 TRUE이면 비동기 통신, FALSE이면 동기 통신이다.

innerHTML : 내부 HTML 코드를 JAVAScript 코드에서 변경할 수 있다.

respenseText : 서버에 요청하여 응답으로 받은 데이터를 문자열로 반환한다.

 

 

 

문제는 어렵지 않은데 저기 위의 aview가 뭔지 모르겠어서 한참을 들여다 봤다...(대충보지 맙시다..) 아무튼 문제를 푸는 핵심은 이 부분에 있는 것 같다.

 

첫부분 때문에 하나씩만 문자가 나타나고 두번째 때문에 마지막에 ?가 출력하는 것! 그래서 이전에 나타나는 문자가 사라지지 않게 +=를 이용해 이어붙였다. 

 

개발자 도구의 콘솔에 자바스크립트를 입력하고 엔터를 누르면

 

위와 같이 FLAG가 출력됨을 확인할 수 있다. auth에 FLAG 값을 입력하면

 

문제가 해결되었음을 확인할 수 있다!

반응형

'STUDY > WEB_Hacking' 카테고리의 다른 글

Webhacking.kr 39번 문제(old)  (3) 2019.12.20
Webhacking.kr 26번 문제(old)  (0) 2019.12.18
Webhacking.kr 24번 문제(old)  (1) 2019.12.17
Webhacking.kr 18번 문제(old)  (0) 2019.12.03
Webhacking.kr 17번 문제(old)  (0) 2019.11.30