[wargame] Flying Chars

문제정보

날아다니는 글자들을 멈춰서 전체 문자열을 알아내세요! 플래그 형식은 DH{전체 문자열} 입니다.

❗첨부파일을 제공하지 않는 문제입니다.
❗플래그에 포함된 알파벳 중 x, s, o는 모두 소문자입니다.
❗플래그에 포함된 알파벳 중 C는 모두 대문자입니다.

Keypoint

개발자도구 Source 탭

---

메인화면

이 문제는 동체시력을 파악하는 문제가 아니다.

<script type="text/javascript">
    const img_files = ["/static/images/10.png", "/static/images/17.png", "/static/images/13.png", "/static/images/7.png","/static/images/16.png", "/static/images/8.png", "/static/images/14.png", "/static/images/2.png", "/static/images/9.png", "/static/images/5.png", "/static/images/11.png", "/static/images/6.png", "/static/images/12.png", "/static/images/3.png", "/static/images/0.png", "/static/images/19.png", "/static/images/4.png", "/static/images/15.png", "/static/images/18.png", "/static/images/1.png"];
    var imgs = [];
    for (var i = 0; i < img_files.length; i++){
      imgs[i] = document.createElement('img');
      imgs[i].src = img_files[i]; 
      imgs[i].style.display = 'block';
      imgs[i].style.width = '10px';
      imgs[i].style.height = '10px';
      document.getElementById('box').appendChild(imgs[i]);
    }

    const max_pos = self.innerWidth;
    function anim(elem, pos, dis){
      function move() {
        pos += dis;
        if (pos > max_pos) {
          pos = 0;
        }
        elem.style.transform = `translateX(${pos}px)`;
        requestAnimationFrame(move);
      }
      move();
    }

    for(var i = 0; i < 20; i++){
      anim(imgs[i], 0, Math.random()*60+20);
    }
  </script>

일단 개발자도구를 통해 동작방식을 살펴보면 이미지 파일들을 가져오는 방식을 사용한다.

이때 개발자도구의 "Source" 탭을 사용하면 아주 편하다.

source 탭을 보면 총 20개의 이미지가 있는것을 확인할 수 있고, 해당 이미의 글자들을 조합해보면 다음과 같다.

const img_files = ["/static/images/10.png", "/static/images/17.png", "/static/images/13.png", "/static/images/7.png","/static/images/16.png", "/static/images/8.png", "/static/images/14.png", "/static/images/2.png", "/static/images/9.png", "/static/images/5.png", "/static/images/11.png", "/static/images/6.png", "/static/images/12.png", "/static/images/3.png", "/static/images/0.png", "/static/images/19.png", "/static/images/4.png", "/static/images/15.png", "/static/images/18.png", "/static/images/1.png"];

위의 텍스트를 코드에 나와있는 순서대로 다시 정렬하면 "Too_H4rd_to_sEe_th3_Ch4rs_x.x" 라는 문자열이 나온다.

 

FLAG

DH{Too_H4rd_to_sEe_th3_Ch4rs_x.x}