크로스 사이트 스크립팅(XSS) Game 해보기 - Level1

2021. 11. 26. 09:00공부/정보보안

반응형
SMALL

 

안녕하세요! 종호 입니다 :)

이번 포스팅에서는 크로스사이트 스크립팅(XSS) Game을 진행을 해볼 예정입니다.

구글에서 제공하는 XSS Game인데, 좀 획기적이다 라는 생각이 들었던 것 같아요.

 

XSS 가 무엇인지 부터 간략히 알아보겠습니다!

크로스 사이트 스크립팅(XSS) 이란, '악의적인 스크립트에 의해 페이지가 깨지거나 개인 정보를 특정 사이트로 전송시키는 공격' 이라고 네이버에서 정의하고 있습니다.

 

해당 포스팅은 자세히 설명하진 않습니다.

나름의 이유는 있으나, 비밀 입니다!

어떻게 적은 설명으로 보여주느냐를 고민하느라 글을 작성하는데 조금 시간이 걸렸던 것 같아요.

 

 

 

 

 

 

 

 

 

일단 해당 게임을 진행해보기 위해서 사이트를 접속해보겠습니다.

검색창에 XSS game 이라고 치면 상단에 위치해 있습니다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

위 링크에 사이트를 걸어뒀습니다.

찾기 번거로우신 분들은 클릭해서 이동하셔도 무방합니다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

들어가면 위 이미지와 같은 메인 페이지가 표시 될텐데요.

 

크로스사이트 스크립트 게임은 6단계 까지 나뉘어져 있으며,

저는 현재 다 풀어놓았기 때문에 각 단계별에 다시 접근할 수 있습니다.

(원래는 1단계 풀면 2단계 진행하고 하는 식이였던 것 같아요.)

 

아래는 위 이미지들의 영어를 네이버 파파고로 그대로 번역한 내용 입니다.

 


경고: XSS 게임 영역에 들어갑니다.

 

환영합니다, 신병님!

 

사이트 간 스크립팅(XSS) 버그는 웹 응용 프로그램에서 가장 흔하고 위험한 유형의 취약성 중 하나입니다. 이 더러운 버거는 당신의 적들이 당신의 앱에서 사용자 데이터를 훔치거나 수정할 수 있도록 할 수 있고 당신은 그것들을 보내는 법을 배워야 합니다, 당장!

 

구글에서, 우리는 이 벌레들이 얼마나 중요한지 잘 알고 있습니다. 실제로 구글은 XSS 문제를 찾아 고치는 데 매우 진지해 가장 민감한 제품에서 발견된 위험한 XSS 버그에 대해 용병들에게 7,500달러까지 지급하고 있다.

 

이 교육 프로그램에서는 XSS 버그를 찾고 이용하는 방법을 배울 것입니다. 이 지식을 사용하여 애플리케이션에서 이러한 버그가 발생하지 않도록 함으로써 상대방을 혼란스럽게 하고 화나게 할 수 있습니다.

 

시험이 끝나면 케이크가 나올 거예요.

 


 

 

 

 

 

이번 포스팅에서는 1단계를 진행 해볼게요!

 

 

 

 

 

 

 

 

 

 

 

1단계의 내용은 위와 같습니다.

영어를 포기했던터라 번역은 도와줘! 파파고! 에 맡기도록 하고,

덩그러니 창 하나 표시되어 있는 상태 입니다.

 

 

영문들의 내용은 아래와 같습니다.


 

[1/6] 레벨 1: 안녕하세요, XSS의 세계

 

임무 설명

이 수준은 사용자 입력이 적절한 이스케이프 없이 페이지에 직접 포함되는 사이트 간 스크립팅의 일반적인 원인을 보여줍니다.

 

아래의 취약한 응용프로그램 창과 상호 작용하여 원하는 JavaScript를 실행할 수 있는 방법을 찾으십시오. 취약한 창 내에서 작업을 수행하거나 해당 URL 표시줄을 직접 편집할 수 있습니다.

 

임무 목표

스크립트를 주입하여 아래 프레임에 JavaScript 경고()를 표시하십시오.

 

경고를 표시하면 다음 단계로 넘어갈 수 있습니다.

 


 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

아래쪽에 toggle 이라는 밑줄이 그어져 있는 글씨를 클릭하면 level1에 해당하는 코드들이,

그 아래에 Hints 에 해당하는 show 이라는 밑줄이 그어져 있는 글씨를 클릭하면 힌트가 하나씩 표시됩니다.

 

이번 레벨에서는 힌트가 총 3개이며, 번역은 아래와 같습니다.

 

 


1. 응용 프로그램의 소스를 보려면 프레임을 마우스 오른쪽 단추로 클릭하고 상황에 맞는 메뉴에서 View Frame Source를 선택하거나 브라우저의 개발자 도구를 사용하여 네트워크 트래픽을 검사할 수 있습니다.

 

2. <h1>과 같은 프레젠테이션 태그를 입력하면 어떻게 됩니까?

 

3. 좋아요, 마지막 힌트: <script> ... 경보...


 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 


힌트 1. 응용 프로그램의 소스를 보려면 프레임을 마우스 오른쪽 단추로 클릭하고 상황에 맞는 메뉴에서 View Frame Source를 선택하거나 브라우저의 개발자 도구를 사용하여 네트워크 트래픽을 검사할 수 있습니다.

 

※ 크롬 기준입니다.

 

힌트 1에 해당하는 프레임 소스는 해당 영역안에 위치한 아무 부분에서 오른쪽 마우스를 클릭하면

프레임 소스 보기 라는 것이 있습니다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

위 이미지는 해당 프레임에 관한 내용 입니다.

html 코드를 어느정도 볼 줄 아시는 분이라면, 대충 어떤 내용인지 추측이 가능하시리라 생각합니다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

크롬 기준으로 F12(또는 Ctrl + Shift + i) 를 누르면

현재 열려있는 페이지에 대해 개발자 도구가 펼쳐집니다.

또한, 오른쪽 마우스 클릭하여 검사 를 누르시면 개발자 도구로 들어가집니다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

개발자 도구에 들어갔을때 해당 페이지의 전체적인 html 코드가 나옵니다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

해당 소스 코드에 마우스를 놓았을때, 크롬 창에서 해당 소스로 구성되어진 영역을 표시해줍니다.

제 마우스의 스크린샷에 찍히지 않아서, '마우스 놓인 위치'라고 위 이미지에 표시해놓았습니다.

 

 

 

 

 

 

 


 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 


 

힌트2. <h1>과 같은 프레젠테이션 태그를 입력하면 어떻게 됩니까?

 

힌트 2의 내용 <h1> 이라는 글씨체에 관련된 html 코드를 알고 있어야 이해하실텐데요.

우선 위 페이지에서 저는 '94년생의발버둥'을 입력하고 Search 를 눌러보겠습니다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Search 를 눌렀을때 URL 에 해당하는 부분이 기존과 조금 달라진 것과,

화면에 표시되는 문자들도 확인해보시면 되겠습니다.

 

URL 에서는 기존에는 ~~/frame? 까지만 작성되어있다가,

Search를 누르니 뒤에 query=94····

라며 글자들이 깨져 있습니다. (한글 지원을 안해줘서...)

 

표시되는 문자

Sorry, no results were found for 94년생의발버둥. Try agin.

이라고 표시 되는데,

제가 입력했던 '94년생의발버둥' 이라는 단어가 그대로 들어가있는것을 확인할 수 있습니다.

 

Try again. 이라는 것을 누르면 첫 표시 페이지로 돌아갈 수 있습니다.

눌러서 돌아가도록 합니다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

자, 이번에는 창에다가

<h1>94년생의발버둥</h1>

이라는 것을 입력해봅니다.

 

Search 를 한번 눌러보도록 하겠습니다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

이전에 그냥 입력했던 '94년생의발버둥'에 비해, 글씨 크기가 커진것을 확인할 수 있습니다.

또한, 해당 페이지에는 html 태그가 적용된다는 것을 확인할 수 있습니다.

 

<h1> 태그는 글짜 크기와 관련된 html 태그이며,

h1 부터 h6 까지 있습니다. (h1, h2, h3, h4, h5, h6)

h1 이 가장 크고, h6이 가장 작습니다.

 

태그에 대한 자세한 설명은 다음에 html 관련으로 포스팅을 또 작성할 때가 오지 않을까요!?

 

 


 

 

 

 

 

 

 

 

 

 

 

 

 


힌트3. 좋아요, 마지막 힌트: <script> ... 경보...

 

<script> 라는 태그 또한 html 코드에서 사용됩니다.

태그들은 시작이 있으면 끝이 있다는 것으로 생각하시며,

 

<h1>이 시작이면, </h1> 이 끝이 되며

<script>이 시작이면, </script>가 끝이 됩니다.

 

<script> 안에는 스크립트와 관련한 내용을 작성할 수 있는데,

여기서 경보 라는것은 alert 라는 것을 의미 합니다.

스크립트 구문 중 alert 라는 함수가 있다고 생각하시면 되며,

 

스크립트에서의 alert 함수는 메세지 창을 하나 띄워주는 것이라고 생각하시면 되겠습니다.

 

alert 함수는 사용자가 표시하고 싶은 텍스트를 표시하느냐,

기존에 정의되어 있는 인수들을 사용하느냐에 따라 ' (아포스트로피)가

유무의 차이가 있습니다.

 

<script>alert(정의되어 있는 인수)<script>

<script>alert('텍스트')</script> 또는 <script>alert("텍스트")</script>

간략하게 위와 같이 작성할 수 있습니다.

 

 

 

 

 


 

 

 

 

 

 

 

 

 

 

이미 정의되어 있는 인수를 하나 사용해보면,

<script>alert(location.host)</script>

을 입력하고 Search 를 누릅니다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

해당 URL 을 표시해주는 창(alert)이 뜹니다.

이미 여기서 level1 은 종료... 확인을 누른 후 다음 단계로 넘어갈 수 있습니다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

<script>alert('94년생의발버둥')</script>

을 입력하고 Search 를 누르면,

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

94년생의발버둥 이라는 텍스트가 표시되는 것을 알 수 있습니다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

위 짤방처럼, URL 부분에다가 직접 입력을 해도 가능합니다.

처음에 Search 를 눌러서 query= 라는것이 URL 에 표시됐었기 때문

~~/frame?query=

로 시작하면 됩니다.

 

 


 

 

html 코드에 대해 자세히 설명하지 않았기 때문에 처음 경험하시는 분들이라면

충분히 어렵다고 느끼실 수 있을것 같습니다.

 

 

글 읽어주셔서 감사합니다.

오늘도 좋은 하루 되세요 :)

 

반응형
LIST

'공부 > 정보보안' 카테고리의 다른 글

Burp Suite 사용하기 - 1  (0) 2021.11.19
패킷 위변조 프로그램, Burp Suite 설치하기  (0) 2021.11.17