hacktricks/pentesting-web/clickjacking.md

# Clickjacking

<details>

<summary><a href="https://cloud.hacktricks.xyz/pentesting-cloud/pentesting-cloud-methodology"><strong>☁️ HackTricks Cloud ☁️</strong></a> -<a href="https://twitter.com/hacktricks_live"><strong>🐦 Twitter 🐦</strong></a> - <a href="https://www.twitch.tv/hacktricks_live/schedule"><strong>🎙️ Twitch 🎙️</strong></a> - <a href="https://www.youtube.com/@hacktricks_LIVE"><strong>🎥 Youtube 🎥</strong></a></summary>

* ¿Trabajas en una **empresa de ciberseguridad**? ¿Quieres ver tu **empresa anunciada en HackTricks**? ¿O quieres tener acceso a la **última versión de PEASS o descargar HackTricks en PDF**? ¡Consulta los [**PLANES DE SUSCRIPCIÓN**](https://github.com/sponsors/carlospolop)!
* Descubre [**The PEASS Family**](https://opensea.io/collection/the-peass-family), nuestra colección exclusiva de [**NFTs**](https://opensea.io/collection/the-peass-family)
* Obtén el [**swag oficial de PEASS & HackTricks**](https://peass.creator-spring.com)
* **Únete al** [**💬**](https://emojipedia.org/speech-balloon/) [**grupo de Discord**](https://discord.gg/hRep4RUj7f) o al [**grupo de Telegram**](https://t.me/peass) o **sígueme** en **Twitter** [**🐦**](https://github.com/carlospolop/hacktricks/tree/7af18b62b3bdc423e11444677a6a73d4043511e9/\[https:/emojipedia.org/bird/README.md)[**@carlospolopm**](https://twitter.com/hacktricks\_live)**.**
* **Comparte tus trucos de hacking enviando PRs al** [**repositorio de hacktricks**](https://github.com/carlospolop/hacktricks) **y al** [**repositorio de hacktricks-cloud**](https://github.com/carlospolop/hacktricks-cloud).

</details>

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

\
Usa [**Trickest**](https://trickest.com/?utm\_campaign=hacktrics\&utm\_medium=banner\&utm\_source=hacktricks) para construir y **automatizar flujos de trabajo** con las herramientas comunitarias más avanzadas del mundo.\
Obtén acceso hoy mismo:

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

## ¿Qué es el Clickjacking?

El Clickjacking es un ataque que **engaña** a un **usuario** para que **haga clic** en un **elemento** de una página web que está **invisible** o disfrazado como otro elemento. Esto puede hacer que los usuarios descarguen malware sin saberlo, visiten páginas web maliciosas, proporcionen credenciales o información sensible, transfieran dinero o compren productos en línea. (De [aquí](https://www.imperva.com/learn/application-security/clickjacking/)).

### Truco de prellenado de formularios

A veces es posible **rellenar el valor de los campos de un formulario utilizando parámetros GET al cargar una página**. Un atacante puede abusar de este comportamiento para llenar un formulario con datos arbitrarios y enviar la carga de clickjacking para que el usuario presione el botón Enviar.

### Rellenar formulario con Arrastrar y soltar

Si necesitas que el usuario **llene un formulario** pero no quieres pedirle directamente que escriba información específica (como el correo electrónico o una contraseña específica que conoces), simplemente puedes pedirle que **Arrastre y suelte** algo que escribirá tus datos controlados como en [**este ejemplo**](https://lutfumertceylan.com.tr/posts/clickjacking-acc-takeover-drag-drop/).

### Carga básica
```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>
```
### Carga de múltiples pasos

Clickjacking can be made more effective by using a multistep payload. In this technique, the attacker tricks the victim into performing a series of actions, each of which contributes to the success of the attack.

The multistep payload can be implemented using various methods. One common approach is to divide the payload into multiple steps, with each step being triggered by a separate click event. For example, the attacker may create a series of invisible buttons or links on a webpage, each of which performs a specific action when clicked.

By tricking the victim into clicking on these invisible elements in a specific sequence, the attacker can carry out a complex attack that would be difficult to achieve with a single click. This can include actions such as enabling microphone or camera access, granting permissions, or even initiating a financial transaction.

To protect against multistep payload attacks, it is important to implement proper clickjacking defenses. This can include techniques such as frame-busting code, X-Frame-Options headers, or Content Security Policy (CSP) settings.

### Carga de múltiples pasos

El clickjacking puede ser más efectivo utilizando una carga de múltiples pasos. En esta técnica, el atacante engaña a la víctima para que realice una serie de acciones, cada una de las cuales contribuye al éxito del ataque.

La carga de múltiples pasos se puede implementar utilizando varios métodos. Un enfoque común es dividir la carga en múltiples pasos, donde cada paso se activa mediante un evento de clic separado. Por ejemplo, el atacante puede crear una serie de botones o enlaces invisibles en una página web, cada uno de los cuales realiza una acción específica al hacer clic.

Al engañar a la víctima para que haga clic en estos elementos invisibles en una secuencia específica, el atacante puede llevar a cabo un ataque complejo que sería difícil de lograr con un solo clic. Esto puede incluir acciones como habilitar el acceso al micrófono o la cámara, otorgar permisos o incluso iniciar una transacción financiera.

Para protegerse contra los ataques de carga de múltiples pasos, es importante implementar defensas adecuadas contra el clickjacking. Esto puede incluir técnicas como código de ruptura de marco, encabezados X-Frame-Options o configuraciones de Política de Seguridad de Contenido (CSP).
```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>
```
### Carga de arrastrar y soltar + clic

Clickjacking can be combined with drag and drop functionality to create a more sophisticated attack. In this technique, the attacker tricks the user into dragging and dropping an object onto a hidden button or link, which triggers a malicious action.

El clickjacking se puede combinar con la funcionalidad de arrastrar y soltar para crear un ataque más sofisticado. En esta técnica, el atacante engaña al usuario para que arrastre y suelte un objeto sobre un botón o enlace oculto, lo que desencadena una acción maliciosa.

To perform this attack, the attacker first creates a transparent layer on top of the target website using HTML and CSS. This layer is then positioned to cover the desired button or link. The attacker then lures the user into performing a drag and drop action on the visible object, which is actually positioned on top of the hidden button or link.

Para llevar a cabo este ataque, el atacante primero crea una capa transparente sobre el sitio web objetivo utilizando HTML y CSS. Luego, esta capa se posiciona para cubrir el botón o enlace deseado. El atacante luego atrae al usuario para que realice una acción de arrastrar y soltar en el objeto visible, que en realidad se encuentra posicionado sobre el botón o enlace oculto.

When the user performs the drag and drop action, they unknowingly trigger the hidden button or link, which can perform actions such as submitting a form, making a purchase, or even granting permissions to the attacker.

Cuando el usuario realiza la acción de arrastrar y soltar, sin saberlo, activa el botón o enlace oculto, que puede realizar acciones como enviar un formulario, realizar una compra o incluso otorgar permisos al atacante.

To protect against drag and drop + click payloads, website owners should implement frame-busting techniques, such as the X-Frame-Options header or the Content-Security-Policy header with the `frame-ancestors` directive. These headers prevent the website from being loaded within an iframe, effectively mitigating clickjacking attacks.

Para protegerse contra las cargas de arrastrar y soltar + clic, los propietarios de sitios web deben implementar técnicas de rompimiento de marcos, como el encabezado X-Frame-Options o el encabezado Content-Security-Policy con la directiva `frame-ancestors`. Estos encabezados evitan que el sitio web se cargue dentro de un iframe, mitigando eficazmente los ataques de 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

Si has identificado un ataque **XSS que requiere que el usuario haga clic** en algún elemento para **activar** el XSS y la página es **vulnerable a clickjacking**, podrías abusar de ello para engañar al usuario y hacer que haga clic en el botón/enlace.\
Ejemplo:\
_Has encontrado un **self XSS** en algunos detalles privados de la cuenta (detalles que **solo tú puedes configurar y leer**). La página con el **formulario** para configurar estos detalles es **vulnerable** a **clickjacking** y puedes **prellenar** el **formulario** con los parámetros GET._\
\_\_Un atacante podría preparar un ataque de **clickjacking** a esa página **prellenando** el **formulario** con la **carga útil XSS** y **engañando** al **usuario** para que **envíe** el formulario. Así, **cuando se envíe el formulario** y se modifiquen los valores, el **usuario ejecutará el XSS**.

## Cómo evitar el Clickjacking

### Defensas del lado del cliente

Es posible ejecutar scripts en el lado del cliente que realicen algunos o todos los siguientes comportamientos para prevenir el clickjacking:

* verificar y hacer cumplir que la ventana de la aplicación actual sea la ventana principal o superior,
* hacer que todos los marcos sean visibles,
* evitar hacer clic en marcos invisibles,
* interceptar y marcar posibles ataques de clickjacking en un usuario.

#### Bypass

Como los bloqueadores de marcos son JavaScript, la configuración de seguridad del navegador puede evitar su funcionamiento o incluso el navegador podría no admitir JavaScript. Una forma efectiva de evitar los bloqueadores de marcos por parte de un atacante es utilizar el **atributo `sandbox` del iframe de HTML5**. Cuando se establece con los valores `allow-forms` o `allow-scripts` y se omite el valor `allow-top-navigation`, el script del bloqueador de marcos puede neutralizarse ya que el iframe no puede verificar si es o no la ventana superior.
```markup
<iframe id="victim_website" src="https://victim-website.com" sandbox="allow-forms allow-scripts"></iframe>
```
Tanto los valores `allow-forms` como `allow-scripts` permiten las acciones especificadas dentro del iframe, pero la navegación de nivel superior está deshabilitada. Esto inhibe los comportamientos de rompimiento de marco mientras permite la funcionalidad dentro del sitio objetivo.

Dependiendo del tipo de ataque de Clickjacking realizado, **también puede ser necesario permitir**: `allow-same-origin` y `allow-modals` o [incluso más](https://www.w3schools.com/tags/att\_iframe\_sandbox.asp). Al preparar el ataque, simplemente verifica la consola del navegador, que puede indicarte qué otros comportamientos debes permitir.

### X-Frame-Options

El encabezado de respuesta HTTP **`X-Frame-Options`** se puede utilizar para indicar si un navegador debe **permitir** o no renderizar una página en un `<frame>` o `<iframe>`. Los sitios pueden usar esto para evitar ataques de Clickjacking, asegurándose de que **su contenido no se incruste en otros sitios**. Establece el encabezado **`X-Frame-Options`** para todas las respuestas que contengan contenido HTML. Los valores posibles son:

* `X-Frame-Options: deny`, que **impide que cualquier dominio enmarque el contenido** _(Valor recomendado)_
* `X-Frame-Options: sameorigin`, que solo **permite que el sitio actual** enmarque el contenido.
* `X-Frame-Options: allow-from https://trusted.com`, que **permite que el 'uri' especificado** enmarque esta página.
* Verifica las limitaciones a continuación porque **esto fallará si el navegador no lo admite**.
* Otros navegadores admiten la nueva directiva **CSP frame-ancestors en su lugar**. Algunos admiten ambos.

### Directiva frame-ancestors de Content Security Policy (CSP)

La protección de Clickjacking **recomendada** es incorporar la directiva **`frame-ancestors`** en la Política de Seguridad de Contenido de la aplicación.\
La directiva **`frame-ancestors 'none'`** es similar en comportamiento a la directiva **X-Frame-Options `deny`** (_Nadie puede enmarcar la página_).\
La directiva **`frame-ancestors 'self'`** es ampliamente equivalente a la directiva **X-Frame-Options `sameorigin`** (_solo el sitio actual puede enmarcarlo_).\
La directiva **`frame-ancestors trusted.com`** es ampliamente equivalente a la directiva **X-Frame-Options** `allow-from` (_solo el sitio de confianza puede enmarcarlo_).

La siguiente CSP permite enmarcar solo en el mismo dominio:

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

Consulta la siguiente documentación para obtener más detalles y ejemplos más complejos:

* [https://w3c.github.io/webappsec-csp/document/#directive-frame-ancestors](https://w3c.github.io/webappsec-csp/document/#directive-frame-ancestors)
* [https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/frame-ancestors](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/frame-ancestors)

### Limitaciones <a href="#limitations" id="limitations"></a>

* **Compatibilidad del navegador:** CSP frame-ancestors aún no es compatible con todos los principales navegadores.
* **X-Frame-Options tiene prioridad:** La [sección "Relación con X-Frame-Options" de la especificación CSP](https://w3c.github.io/webappsec/specs/content-security-policy/#frame-ancestors-and-frame-options) dice: "_Si un recurso se entrega con una política que incluye una directiva llamada frame-ancestors y cuya disposición es "enforce", entonces se DEBE ignorar el encabezado X-Frame-Options_", pero Chrome 40 y Firefox 35 ignoran la directiva frame-ancestors y siguen el encabezado X-Frame-Options en su lugar.

## Referencias

* [**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).png" alt=""><figcaption></figcaption></figure>

\
Utiliza [**Trickest**](https://trickest.com/?utm\_campaign=hacktrics\&utm\_medium=banner\&utm\_source=hacktricks) para construir y **automatizar flujos de trabajo** con las herramientas comunitarias más avanzadas del mundo.\
Obtén acceso hoy mismo:

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

<details>

<summary><a href="https://cloud.hacktricks.xyz/pentesting-cloud/pentesting-cloud-methodology"><strong>☁️ HackTricks Cloud ☁️</strong></a> -<a href="https://twitter.com/hacktricks_live"><strong>🐦 Twitter 🐦</strong></a> - <a href="https://www.twitch.tv/hacktricks_live/schedule"><strong>🎙️ Twitch 🎙️</strong></a> - <a href="https://www.youtube.com/@hacktricks_LIVE"><strong>🎥 Youtube 🎥</strong></a></summary>

* ¿Trabajas en una **empresa de ciberseguridad**? ¿Quieres ver tu **empresa anunciada en HackTricks**? ¿O quieres tener acceso a la **última versión de PEASS o descargar HackTricks en PDF**? ¡Consulta los [**PLANES DE SUSCRIPCIÓN**](https://github.com/sponsors/carlospolop)!
* Descubre [**The PEASS Family**](https://opensea.io/collection/the-peass-family), nuestra colección exclusiva de [**NFTs**](https://opensea.io/collection/the-peass-family)
* Obtén el [**merchandising oficial de PEASS y HackTricks**](https://peass.creator-spring.com)
* **Únete al** [**💬**](https://emojipedia.org/speech-balloon/) [**grupo de Discord**](https://discord.gg/hRep4RUj7f) o al [**grupo de Telegram**](https://t.me/peass) o **sígueme** en **Twitter** [**🐦**](https://github.com/carlospolop/hacktricks/tree/7af18b62b3bdc423e11444677a6a73d4043511e9/\[https:/emojipedia.org/bird/README.md)[**@carlospolopm**](https://twitter.com/hacktricks\_live)**.**
* **Comparte tus trucos de hacking enviando PR al** [**repositorio de hacktricks**](https://github.com/carlospolop/hacktricks) **y al** [**repositorio de hacktricks-cloud**](https://github.com/carlospolop/hacktricks-cloud).

</details>