'webhacking.kr 16번'에 해당되는 글 1건

  1. 2015.10.13 webhacking 16번 문제

webhacking 16번 문제

Webhacking 2015. 10. 13. 21:04

안녕하세요. 오늘은 webhacking 16번 문제를 풀어보겠습니다.

홈페이지로 들어가 webhacking 16번을 눌러주세요.

심플하네요. 소스를 한 번 봅시다.

document.body.innerHTML+="<font color=yellow id=aa style=position:relative;left:0;top:0>*</font>";


function mv(cd)
{
kk(star.style.posLeft-50,star.style.posTop-50);
if(cd==100) star.style.posLeft=star.style.posLeft+50;
if(cd==97) star.style.posLeft=star.style.posLeft-50;
if(cd==119) star.style.posTop=star.style.posTop-50;
if(cd==115) star.style.posTop=star.style.posTop+50;
if(cd==124) location.href=String.fromCharCode(cd);
}
function kk(x,y)
{
rndc=Math.floor(Math.random()*9000000);
document.body.innerHTML+="<font color=#"+rndc+" id=aa style=position:relative;left:"+x+";top:"+y+" onmouseover=this.innerHTML=''>*</font>";
}

흠... 첫 document 쪽을 보시면 *을 출력하는 내용이네요. innerHTML이 쓰인것을 알 수 있습니다. innerHTML은 특정 요소의 내용을 가져오거나, 특정 요소의 내용을 변경하는 자바스크립트 함수입니다.

document.body.innerHTML+=이라고 되어있으므로 가져온 특정 요소 즉 +=오른쪽의 내용을 출력하려는 무언가의 body에 추가하겠다는 뜻입니다.

그런데 스타일 부분에 다음과 같이  position:relative;left:0;top:0 라고 적혀있습니다. 

position은 엘리먼트(요소)의 배치방식을 설정하는 속성입니다. relative는 상대위치를 지정하는 속성이지요. left와 top은 좌표라고 보시면 됩니다. 가로,세로 이지요. 여기선 (0,0)이네요.

정리하면 0,0위치에 aa라는 *을 출력한다라고 되어있네요.

두번째부턴 function 즉 사용자 정의 함수가 쓰였습니다. 자세한건 php함수설명 항목을 참고하세요.

mv와 kk라는 함수를 임의로 만든 것 같습니다.

일단 kk부터 살펴봅시다.

rndc라는 변수에 Math.floor(Math.random()*9000000)의 값을 집어넣는다는군요. Math.floor 는 소수값이 존재할 때 소수값을 버리는 역활을 하는 함수합니다. Math.random 함수는 난수를 생성시키는 함수이지요. 옆에 9000000은 최대값을 의미합니다. 즉 0에서 9000000 사이의 값을 랜덤으로 집어넣는다는 뜻입니다. 소수값은 버리니까 정수만 저장이 됩니다.

그다음은 document를 이용해 또 별을 출력시키는군요. 다만 left는 x값이고 top은 y값이네요.

kk(x,y)라고 했으므로 입력 받은 x,y값 위치에 출력시키겠다는 뜻입니다. 그리고 onmouseover속성이 쓰였네요. 이것은 해당 이벤트를 사용한 영역에 마우스 커서를 올렸을때 이벤트를 발생시키겠다는 소리입니다. 마우스 커서를 올리면 this.innerHTML이벤트를 발생시키네요ㅣ.

this 즉 이것의 특정요소의 내용을 "로 변경시킨다고 적혀있습니다. 한마디로 없앤다는군요.

자 이제 마지막으로 mk를 살펴봅시다.

첫줄에 kk함수를 호출합니다. 단 kk의 x값은 star.style.posLeft-50이네요. posLeft란 개체의 좌표값을 반환하는 속성입니다. star의 left좌표값을 반환한다는 뜻입니다. 이값에 -50을 한 값이 kk의 x값이 된다는 뜻입니다. y도 마찬가지입니다.

그다음은 if문을 사용해 cd값을 비교하네요. 각각 cd값에 따라 좌표값을 바꾸는군요.

그런데? 맨마지막 if문을 보시면 cd값이 124이면 location.href가 실행된다는군요. 이 함수는 페이지를 이동시키는 함수입니다. 이동할 주소를 보니까 

String.fromCharCode(cd)라고 되어있네요. String.fromCharCode는 받은 값을 각각 유니코드에 해당되는 문자 또는 문자열로 반환시키는 함수입니다. 그렇다면 cd가 조건에서 나왔듯이 124라고 치면 그에 해당되는 기호인 |로 반환되고 그러면 location.href에 의해 주소가 |인 페이지로 이동할 것 같습니다.

자 이제 소스 분석은 거의 끝났습니다. 그러면? 이제 의문점이 하나 생기지요.

이 사용자 정의 함수 mv는 언제 실행되는가 입니다.

소스를 처음부터 끝까지 살펴보면

이러한 소스가 보입니다. onload가 쓰였네요.

html에선 위에서 아래로 즉 차례대로 소스가 실행이 됩니다. 실제로 함수가 작동되는 부분은 script부분이지요. 그런데 body는 script보다 먼저 실행됩니다. 그래서 body부분에서 script관련 함수가 나오면 당연히 아직 script가 구현이 되지 않았기 때문에 오류가 나버립니다. 그런데 onload를 쓰면 body에 함수실행문을 적어도 모든 구현이 다 끝난 후 kk(1,1)이 실행되기 때문에 오류가 나지 않습니다.

onkeypress는 키보드에서 키를 눌렀을 때 이벤트를 발생시키는 속성입니다. 꾹 누르고 있는 동안에도 이벤트가 발생하지요. 단 shift나 enter키, 한/영 같은 키는 인식하지 못합니다.

event.keyCode는 사용자의 입력키 값을 반환합니다. 예를 들어 제가 a를 입력한다면 a값을 반환시키는 것이지요. 다만 따로 출력하라는 명령어를 주지 않으면 a를 입력했다도 해도 a값이 아닌 a에 해당되는 숫자를 저장시킵니다.

총 정리를 해보면 

1. 이 페이지로 들어오자마자 kk함수에 의해 (1,1)위치에 별이 생성된다.

2. mv의 cd값은 우리가 입력한 키보드의 값이다. 또한 키를 누를때 혹은 쭉 누르고 있을때마다 mv함수가 실행된다.

3. cd값이 124이면 주소가 |인 페이지로 이동한다.

지금 소스자체만 보시면 문제를 해결할 수 있는 방법이 없습니다. 그렇다면 3번을 참고하여 새 페이지로 이동할 필요가 있습니다.

cd값이 124여야 하므로 보통 124를 친다고 생각할 수 있지만 키 한번에 하나씩 인식하므로

124로 인식이 안되고 1과 2와 4로 인식이 됩니다.

받은 문자를 숫자로 저장시키므로 124에 해당되는 문자를 입력해봅시다.

124에 해당하는 유니코드 문자는 |입니다. 입력해봅시다.

shift는 onkeypress의 영향을 받지 않으므로 shift를 눌러도 mk가 실행되진 않습니다.

페이지로 이동이 되었습니다. 바로 패스워드가 나오는군요. 인증해 봅시다.

전송 해봅시다.

네 이것으로 문제풀이를 마치겠습니다.




'Webhacking' 카테고리의 다른 글

webhacking 25번 문제  (0) 2015.10.15
webhacking 19번 문제  (0) 2015.10.15
webhacking 14번 문제  (0) 2015.10.13
webhacking 4번 문제  (0) 2015.10.13
webhacking 6번 문제  (0) 2015.10.12
Posted by englishmath
,