Clickjacking
Definition
Clickjacking, sometimes called a UI redress attack, works by layering. The attacker's page contains a frame holding a real page from another site, made transparent with CSS and positioned so that a specific control on the hidden page sits under something the visitor has a reason to click. The click lands on the real page, in the visitor's own session, with their own cookies. Nothing is forged and no password is stolen; the visitor genuinely performed the action, just not the one they saw. Variants include drag-and-drop tricks and likejacking, where the hidden control is a social share button. The defence is for the framed page to refuse to be framed at all.
Why It Matters
The risk scales with what a single click can do on your page. A static brochure or a hosted PDF has no state to change, so framing it is a nuisance at worst. A page with a delete button, a one-click approval, a form that submits on click or a payment confirmation is a different matter — one hidden click there is a real action with real consequences. The historical cases that made the technique famous involved router admin pages and social network share buttons, both reachable in an ordinary logged-in session. Getting the defence right costs one header; getting it wrong is not detectable from your own analytics, because to you the click looks entirely normal.
How It Works
The attack needs three things: your page must load in a frame, it must be usable while framed, and the visitor must already be authenticated to it. Removing the first condition removes the attack. Modern practice is the Content-Security-Policy directive frame-ancestors, set to 'none' to forbid framing or to a list of permitted origins such as 'self' https://partner.example.com. The older X-Frame-Options header, with DENY or SAMEORIGIN, does the same job for browsers and tools that predate CSP, and sending both is common. Frame-busting JavaScript — a script that checks whether window.top differs from window.self and tries to break out — was the pre-header approach and is unreliable, since the sandbox attribute on the framing iframe can disable the script entirely.
Real-World Example
A consultancy publishes an approval page at contract-signoff.99helpers.site where a client clicks a single button to accept a scope. Because that click carries weight, the page is served with frame-ancestors 'none' and X-Frame-Options DENY. An attempt to embed it in an unrelated page renders an empty frame, so the only place the button can be pressed is the address the client was actually sent.
Common Mistakes
- ✕Relying on frame-busting JavaScript — an iframe with a restrictive sandbox attribute stops that script running, and the page frames anyway
- ✕Assuming a static page is immune — if it carries any control that performs an action on click, it can be framed and clicked
- ✕Setting the protection in a meta tag instead of an HTTP header, which leaves the page framable exactly as before
- ✕Blocking all framing on pages meant to be embedded, then treating the blank embed as a bug in the embedding tool
Related Terms
X-Frame-Options
An older response header that tells the browser whether a page may be displayed inside a frame or iframe. It takes two useful values, DENY and SAMEORIGIN.
Content Security Policy
A response header that tells the browser which sources a page is allowed to load scripts, styles, images and frames from. Anything outside the policy is blocked before it runs.
Same-Origin Policy
The browser rule that keeps code loaded from one origin from reading data belonging to another. It is the foundation the rest of web security is built on.
iframe Sandbox
The sandbox attribute on an HTML iframe strips the embedded page of most privileges, then lets you hand back only the ones you name. It is how a host page displays untrusted content without giving it the run of the browser.
Hotlinking
Hotlinking is when another site embeds a file using its address on your host, so every visitor to their page downloads it from you. They get the image; you get the traffic bill.
Put a file online in seconds
Drop in a document, an image, a page or a whole static website and share the link — free, with no build step and no server to set up.
Host a file free →