Web › Module 4 › Lesson 3
Clickjacking
Invisible frames and deceptive overlays that trick users into clicking your site while activating another
Visual · web_developer
Clickjacking loads your trusted site in a hidden iframe and overlays fake buttons—so users think they are clicking “Win a prize” but confirm a bank transfer.
Opening
Your click went somewhere else
The user sees a harmless game: “Click the duck to score points.” Underneath, in a transparent iframe, is the real “Transfer \$500” button on their banking site. Because the victim is already logged in, one mis-click executes a sensitive action. No malware required—just framing and UI deception.
1. Mechanics
Attack page structure: • iframe src="https://bank.example/transfer" with opacity: 0 or tiny size • Decoy button aligned exactly over the iframe’s real button • Victim clicks decoy → click passes through to iframe Variants include likejacking (hidden Facebook Like) and cursorjacking (fake cursor position).
2. Defenses
X-Frame-Options
DENY or SAMEORIGIN—legacy but still useful.
Content-Security-Policy frame-ancestors
Modern replacement: frame-ancestors 'self' or none.
Sensitive actions
Re-auth, MFA step-up, or non-idempotent POST with CSRF tokens.
3. PoC Skeleton (Local Lab Only)
Educational clickjacking demo page — never deploy against real users<style> iframe { opacity: 0.0; position: absolute; top: 40px; left: 40px; } .decoy { position: absolute; top: 40px; left: 40px; } </style> <button class="decoy">Click for free gift!</button> <iframe src="http://localhost:8080/vulnerable-action"></iframe>
<style>
iframe { opacity: 0.0; position: absolute; top: 40px; left: 40px; }
.decoy { position: absolute; top: 40px; left: 40px; }
</style>
<button class="decoy">Click for free gift!</button>
<iframe src="http://localhost:8080/vulnerable-action"></iframe>Test your own headers
Use securityheaders.com or curl -I on your staging site to verify X-Frame-Options or CSP frame-ancestors. Only build PoCs against apps you own.
Knowledge Check
Clickjacking primarily tricks users into:
Multiple choice
Knowledge Check
True or False: CSP frame-ancestors helps prevent your site from being embedded in malicious frames.
True or False
Knowledge Check
X-Frame-Options: DENY means:
Multiple choice