Level 05

 

Sign up을 눌러보았다.

url에 /signup?next=confirm이 추가된 것을 확인할 수 있었다.

이는 GET방식으로 데이터를 보내는 것이다.

GET 방식
: 클라이언트의 데이터를 URL 뒤에 붙여보내는 방식

- ?를 통해 URL의 끝임을 알려주며, 동시에 데이터 표현의 시작점임을 알 수 있다.
- URL에 데이터가 노출되어 보안에 취약하다.

 

Next를 눌러보았다.

url 뒷부분이 confirm으로 바뀌었고 몇초 후에 다시 원래 페이지로 돌아간다.

 

 

<a href="{{ next }}">Next >></a>

이 a 태그를 통해 Next를 누르면 next url로 넘어간다.

그럼 Next를 누를 때 원래의 next 페이지가 아닌 다른 페이지로 넘어가도록 하면 될 것이다.

 

힌트 4에서 이러한 코드를 발견할 수 있었다.

따라서 ?next=javascript:alert(); 라고 입력해주었다.

Go를 누르고 Next까지 눌렀더니 다음단계로 넘어갈 수 있었다.

 


Level 06

 문제에 있는 XMLHttpRequest에 대해 찾아보았다.

XMLHttpRequest
:  서버와 통신을 하려면 서버에 데이터를 요청하고 결과를 받아와야 하는데 이때 서버와 주고받는 데이터를 쉽게 다룰 수 있는 방법

<사용법>
1. XMLHttpRequest 객체 생성
2. onreadystatechange에 함수 설정
3. open()함수 통해 요청 초기화
4. send()함수 통해 요청

 

이처럼 url #뒤의 문자를 조작하면 아래 Loaded gadget from 뒤의 문자도 바뀌게 된다.

 

<!doctype html>
<html>
  <head>
    <!-- Internal game scripts/styles, mostly boring stuff -->
    <script src="/static/game-frame.js"></script>
    <link rel="stylesheet" href="/static/game-frame-styles.css" />
 
    <script>
    function setInnerText(element, value) {
      if (element.innerText) {
        element.innerText = value;
      } else {
        element.textContent = value;
      }
    }
 
    function includeGadget(url) {
      var scriptEl = document.createElement('script');
 
      // This will totally prevent us from loading evil URLs!
      if (url.match(/^https?:\/\//)) {
        setInnerText(document.getElementById("log"),
          "Sorry, cannot load a URL containing \"http\".");
        return;
      }
 
      // Load this awesome gadget
      scriptEl.src = url;
 
      // Show log messages
      scriptEl.onload = function() { 
        setInnerText(document.getElementById("log"),  
          "Loaded gadget from " + url);
      }
      scriptEl.onerror = function() { 
        setInnerText(document.getElementById("log"),  
          "Couldn't load gadget from " + url);
      }
 
      document.head.appendChild(scriptEl);
    }
 
    // Take the value after # and use it as the gadget filename.
    function getGadgetName() { 
      return window.location.hash.substr(1) || "/static/gadget.js";
    }
 
    includeGadget(getGadgetName());
 
    // Extra code so that we can communicate with the parent page
    window.addEventListener("message", function(event){
      if (event.source == parent) {
        includeGadget(getGadgetName());
      }
    }, false);
 
    </script>
  </head>
 
  <body id="level6">
    <img src="/static/logos/level6.png">
    <img id="cube" src="/static/level6_cube.png">
    <div id="log">Loading gadget...</div>
  </body>
</html>

코드에서 볼 수 있듯이 https가 url에 존재하는지 여부만 판단하고 있다. http://가 포함되면 로드가 되지 않는다.

 

찾아보니 Data URL Scheme 방법이 있다고 한다.

Data URL Scheme
data:[자료타입],[데이터] 방식으로 데이터를 URL형태로 표현

이 문제에서는 data:javascript,alert(); 라고 입력하면 될 것 같아 url에 # 뒷부분에 추가해주었다.

 

그랬더니 성공했다.

Level 03

URL을 이용해 풀이해야 하는 문제이다. 

각 image를 눌러본 결과, URL의 #뒤에 숫자가 바뀌는 것을 볼 수 있었다.

 

소스코드를 보면 변수 html에 <img src='/static/level3/cloud" + num + ".jpg' />의 이미지 태그가 들어가있다. 

 

image가 3까지 밖에 없기 때문에 #뒤의 숫자를 1, 2, 3이 아닌 숫자로 바꿔줄 경우 아무 그림도 뜨지 않는다.

level 2에서처럼 잘못된 이미지 경로를 넣어주고 onerror을 실행시켜보기로 하였다. 

 

onerror="alert('error');"를 입력해주었다.

다음과 같은 창이 뜨며 다음단계로 넘어갈 수 있었다.

 

 

+) 사실 굳이 1, 2, 3이 아닌 수를 넣을 필요가 없었다. onerror 코드를 넣어주는 것만으로도 잘못된 이미지 경로를 주는 것과 마찬가지였다. 


Level 04

먼저 프로그램이 어떤식으로 작동하는 지 확인해보았다.

입력 칸에 3이라 쓰고 Create timer이라는 버튼을 눌렀을 때 URL에 ?timer=3가 추가되며 3초 타이머가 만들어졌다.

타이머가 종료됨과 동시에 Time is up!이라는 문구의 창이 떴다.

 

힌트 1에서 알려준 것 처럼 startTimer가 어디서 쓰이는 지 소스코드에서 확인해보았다.

startTimer은 onload속성에 의해 호출되고 있었다.

onload는 이미지가 로드된 직후에 실행된다.

 

https://xss-game.appspot.com/level4/frame?timer=('{{timer}}');의 형태로 전달되기 때문에 {{timer}}부분에 alert창을 띄우도록 해야한다.

');alert('error 라고 작성해주어 timer 뒷부분에 alert창이 들어가도록 하였다.

하지만 실행되지 않았다.

 

검색해 본 결과 힌트2에서 말하는 것처럼 세미콜론을 인코딩해서 넣어야 했던 것이다.

세미콜론을 인코딩하면 %3B가 나왔다.

세미콜론을 대신해 %3B를 넣어주었다.

 

실행해보았더니 %3B가 세미콜론으로 변하였고 다음과 같은 창이 떴다.

'Web Hacking > WEB Hacking 기초' 카테고리의 다른 글

[SISS] 웹 프로젝트 5주차  (0) 2022.01.26
[SISS] XSS Game 05, 06  (0) 2022.01.22
[SISS] 생활코딩 DATABASE-MySQL 정리  (0) 2022.01.08
[SISS] XSS Game 01, 02  (0) 2022.01.03
[SISS] XSS 공부  (0) 2021.12.31

데이터베이스

- 누구나 쉽게 데이터를 정리정돈할 수 있는 전문적인 소프트웨어

- 데이터를 표의 형태로 정리정돈할 수 있고 정렬 검색과 같은 작업을 빠르고 편리하고 안전하게 할 수 있다.

- MySQL, Oracle, SQL Server, PostgreSQL, DB2, Access 는 관계형 데이터베이스를 위한 기술들이다.

 

MySQL 구조

1) 표

2) 스키마 : 서로 연관된 표(데이터)들을 그룹핑하는 폴더

3) 데이터베이스 서버

 

서버 접속

1) cmd창을 켠다

2) cd명령어를 통해 mysql 위치로 이동

3) mysql -uroot -p 작성

 

스키마의 사용

- 데이터베이스 생성, 삭제, 확인, 사용

CREATE DATABASE 이름; //생성
DROP DATABASE 이름; //삭제
SHOW DATABASES; //데이터베이스 확인
USE 이름; // 해당 이름의 스키마에 있는 표를 대상으로 명령을 실행

 

SQL과 테이블의 구조

SQL(Structured Query Language) : 관계형 데이터베이스 카테고리에 속한 제품들이 공통적으로 데이터베이스 서버를 제어할 때 사용하는 표준화된 언어

 

 

테이블의 생성

CREATE TABLE topic(
      id INT(11) NOT NULL AUTO_INCREMENT,
      title VARCHAR(100) NOT NULL,
      description TEXT NULL,
      created DATETIME NOT NULL,
      author VARCHAR(30) NULL,
      profile VARCHAR(30) NULL,
      PRIMARY KEY(id));

not null : 공백을 허용하지 않겠다

null : 공백을 허용하겠다

AUTO_INCREMENT : 자동으로 1씩 증가시켜 중복되지 않는 식별자를 갖게된다

VARCHAR(100) : 100글자까지는 입력 가능, 그 이상은 지워버린다

PRIMARY KEY(id) : id값은 중복되지 않는다

dDd생성된 topic TABLE

 

CRUD

Create Read Update Delete : 데이터베이스가 가지고 있는 중요한 네가지 작업

 

INSERT

 INSERT INTO 테이블이름(필드이름1, 필드이름2, 필드이름3, ...) VALUES (데이터값1, 데이터값2, 데이터값3, ...);

 

SELECT

- 추가한 데이터 확인하기(모든 필드)

SELECT * FROM 테이블이름

 

- 원하는 필드만 데이터 확인하기

SELECT 필드이름1, 필드이름2, ..., 필드이름n FROM 테이블이름;

 

- 옵션 : 특정 값을 가지는 행을 출력하기

SELECT 필드이름1, 필드이름2, ..., 필드이름n FROM 테이블이름 WHERE 필드이름='특정 값';

 

- 옵션 : 정렬하기

SELECT 필드이름1, 필드이름2, ..., 필드이름n FROM 테이블이름 WHERE 필드이름='특정 값' ORDER BY 필드이름 정렬방법;

정렬 방법 : ASC(오름차순), DESC(내림차순)

 

- 옵션 : 개수 제한 두기

SELECT 필드이름1, 필드이름2, ..., 필드이름n FROM 테이블이름 WHERE 필드이름='특정 값' ORDER BY 필드이름 정렬방법 LIMIT 개수;

 

UPDATE

UPDATE 테이블이름 SET 필드이름1=데이터값1, 필드이름2=데이터값2, ... WHERE 필드이름=데이터값;

수정 후

cf) WHERE문을 작성하지 않으면 모든 값이 바뀐다.

 

DELETE

DELETE FROM 테이블이름 WHERE 필드이름=데이터값;

cf) WHERE문을 작성하지 않으면 모든 값이 삭제된다.

 

관계형데이터베이스의 필요성

- 데이터의 중복 제거

- 참조테이블

장점 : 중복 제거 가능, 일괄적으로 데이터의 수정 가능, 같은 이름의 값이라도 구분 가능

단점 : 직관적으로 데이터를 볼 수 없음

=> 데이터를 별도의 테이블로 보관함으로써 중복을 발생시키지 않는 참조테이블의 장점 + 실제로 데이터를 하나의 테이블로 볼 수 있는 기존테이블의 장점 = MySQL을 이용하면 가능해짐(저장 : 분산/ 보여줄 때 : 합쳐서)

 

테이블 분리하기

- 테이블 이름 변경

RENAME TABLE 테이블이름 TO 변경할 테이블이름;

 

 

https://opentutorials.org/module/3300/19521에서 가져온 코드

--
-- Table structure for table `author`
--
 
 
CREATE TABLE `author` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `name` varchar(20) NOT NULL,
  `profile` varchar(200) DEFAULT NULL,
  PRIMARY KEY (`id`)
);
 
--
-- Dumping data for table `author`
--
 
INSERT INTO `author` VALUES (1,'egoing','developer');
INSERT INTO `author` VALUES (2,'duru','database administrator');
INSERT INTO `author` VALUES (3,'taeho','data scientist, developer');
 
--
-- Table structure for table `topic`
--
 
CREATE TABLE `topic` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `title` varchar(30) NOT NULL,
  `description` text,
  `created` datetime NOT NULL,
  `author_id` int(11) DEFAULT NULL,
  PRIMARY KEY (`id`)
);
 
--
-- Dumping data for table `topic`
--
 
INSERT INTO `topic` VALUES (1,'MySQL','MySQL is...','2018-01-01 12:10:11',1);
INSERT INTO `topic` VALUES (2,'Oracle','Oracle is ...','2018-01-03 13:01:10',1);
INSERT INTO `topic` VALUES (3,'SQL Server','SQL Server is ...','2018-01-20 11:01:10',2);
INSERT INTO `topic` VALUES (4,'PostgreSQL','PostgreSQL is ...','2018-01-23 01:03:03',3);
INSERT INTO `topic` VALUES (5,'MongoDB','MongoDB is ...','2018-01-30 12:31:03',1);

 

 

테이블을 author, topic 2개로 분리하였다

 

JOIN

SELECT * FROM 테이블1 LEFT JOIN 테이블2 ON 테이블1.필드a = 테이블2.필드b;

테이블1의 필드a와 테이블2의 필드b가 같은 것을 의미할 때 이 둘을 기준으로 두 테이블을 join시킨다.

모든 필드 보이도록 지정
정해진 필드만 보여지도록 지정

 

인터넷과 데이터베이스

Internet

- 인터넷을 이용하기 위해서 필요한 최소한의 컴퓨터 : 2대

- 각자 흩어져있는 컴퓨터들이 인터넷으로 연결되면서 컴퓨터들 간의 사회가 만들어짐 => 한 대의 컴퓨터가 가지고 있는 한계를 초월함

- 한 대의 컴퓨터는 다른 컴퓨터에게 정보를 요청, 다른 컴퓨터는 요청한 정보를 응답

 

ex) 웹

웹이 동작하려면 인터넷이 필요하고, 인터넷 위에서 동작하기 때문에 두 대의 컴퓨터가 필요함.

한 대의 컴퓨터에는 웹 브라우저가 설치, 웹 브라우저에 주소를 입력함

-> 웹 브라우저가 설치된 컴퓨터가 요청한 정보를 요청한 컴퓨터에게 전송

-> 정보를 받아 웹브라우저에 표시(응답)

 

요청하는 쪽 : Client ex) 웹 클라이언트, 게임 클라이언트, 채팅 클라이언트

응답하는 쪽 : Server ex) 웹 서버, 게임 서버, 채팅 서버

 

MySQL 설치하면 동시에 2개 설치 (데이터베이스 클라이언트 & 데이터베이스 서버)

- 데이터베이스 클라이언트를 통해 데이터베이스 서버에 접속

- 데이터베이스 서버 : 데이터 저장

 

데이터베이스 서버를 직접 다룰 수 없음 -> 데이터베이스 클라이언트(ex) MySQL)를 통해야 다룰 수 있음 

 

MySQL Workbench

- GUI 기반의 MySQL Client

코드 입력 후 번개 표시 클릭하면 표가 나온다

 

- 새로운 스키마 생성

이름 지정 후 apply 버튼을 누른다.

 

apply 버튼 누르고 finish 버튼을 누른다.

 

workbench라는 데이터베이스가 추가된 것을 확인할 수 있다.

 

- 새로운 테이블 생성

데이터 작성 후 apply 버튼을 누른다.

sql문이 나오는 것을 확인할 수 있다.

 

=> MySQL 모니터, MySQL Workbench 등 모든 클라이언트들은 MySQL 서버에 전송함으로써 데이터베이스 서버를 제어한다.

'Web Hacking > WEB Hacking 기초' 카테고리의 다른 글

[SISS] XSS Game 05, 06  (0) 2022.01.22
[SISS] XSS Game 03, 04  (0) 2022.01.10
[SISS] XSS Game 01, 02  (0) 2022.01.03
[SISS] XSS 공부  (0) 2021.12.31
[SISS] 생활코딩 WEB2-PHP 정리  (0) 2021.12.28

Level 01


alert 창을 띄우기 위해 <script>구문을 사용하여 <script>alert();</script>라고 입력해주었다.


입력하였더니 alert가 뜨고 다음 단계로 넘어갈 수 있었다.


Level 02

<script>alert();</script>를 입력해주어도 아무 변화가 일어나지 않는다.

onerror를 검색해보니 이미지 로드 실패 시 실행되는 img 태그의 속성임을 알 수 있었다.

img가 로드되지 않게 하고 onerror 속성을 이용해 경고창을 띄우기 위해 <img src="/" onerror="alert()">라고 작성해주었다.

 

입력하였더니 alert가 뜨고 다음 단계로 넘어갈 수 있었다.

'Web Hacking > WEB Hacking 기초' 카테고리의 다른 글

[SISS] XSS Game 05, 06  (0) 2022.01.22
[SISS] XSS Game 03, 04  (0) 2022.01.10
[SISS] 생활코딩 DATABASE-MySQL 정리  (0) 2022.01.08
[SISS] XSS 공부  (0) 2021.12.31
[SISS] 생활코딩 WEB2-PHP 정리  (0) 2021.12.28

+ Recent posts