01 What is Clickjacking?
Clickjacking (UI redressing) is a deceptive technique where an attacker tricks a user into clicking on something different from what the user perceives they are clicking on.
Imagine visiting a website claiming you won a prize with a big "CLAIM PRIZE" button. Unknown to you, the attacker has loaded your bank's website in an invisible iframe on top of that button. When you click "CLAIM PRIZE", you are actually clicking "Confirm Transfer" on your bank's site.
02 How It Works
The attack relies on the ability to embed your website inside an <iframe>. By adjusting the CSS opacity of the iframe to 0 (making it invisible) and positioning it over a tempting button on the attacker's site, they can hijack your mouse clicks.
Because the user is already logged into the target site (like Facebook, Twitter, or a bank) in their browser, the click is authenticated and the action is performed.
03 Defense Strategies
The defense is simple: tell the browser NOT to render your site inside a frame.
1. X-Frame-Options (XFO)
The classic header. Setting it to DENY or SAMEORIGIN prevents all external framing.
X-Frame-Options: SAMEORIGIN 2. CSP frame-ancestors
The modern, more flexible approach. It allows you to whitelist specific domains.
Content-Security-Policy: frame-ancestors 'self' https://trusted-partner.com; 04 Testing Your Site
You can easily test if your site is vulnerable by creating a simple HTML file on your computer:
<iframe src="https://your-website.com" width="500" height="500"></iframe>Open this file in your browser. If your website loads inside the box, you are vulnerable. If you see a blank space or a "refused to connect" error, you are safe.
05 Frequently Asked Questions
Is X-Frame-Options deprecated?
Technically, the CSP 'frame-ancestors' directive is the modern replacement. However, X-Frame-Options is still widely supported and recommended for defense-in-depth.
Can I allow only specific sites to iframe me?
Yes! Using CSP's `frame-ancestors` directive, you can list specific domains that are allowed to embed your content.
Does clickjacking affect mobile users?
Absolutely. In fact, on smaller screens where UI elements are closer together, clickjacking can sometimes be even more effective.
What is UI Redressing?
UI Redressing is just another name for Clickjacking. It describes the technique of covering the real user interface with a fake one.