mediumCWE-1021A05:2021

Advanced Clickjacking

Absence of both X-Frame-Options and CSP frame-ancestors headers, combined with no client-side frame-busting logic, leaving the app fully embeddable in malicious iframes.

How It Works

Clickjacking overlays your invisible app on top of an attacker's fake interface. Advanced versions chain multiple clicks (multi-step clickjacking) to complete multi-factor operations like enabling OAuth apps, deleting data, or sending money. Without frame-ancestors CSP and X-Frame-Options, the browser has no way to refuse embedding.

Vulnerable Code
// BAD: no framing protection at all
// next.config.ts with no headers
// No X-Frame-Options, no CSP frame-ancestors
// Client also has no frame detection
Secure Code
// GOOD: headers + client-side defense-in-depth
// next.config.ts
const headers = [
  { key: 'X-Frame-Options', value: 'DENY' },
  { key: 'Content-Security-Policy', value: "frame-ancestors 'none'" }
];
// Optional JS defense (belt and suspenders)
if (window.top !== window.self) window.top!.location = window.location.href;

Real-World Example

Twitter had a clickjacking vulnerability (2009) that allowed attackers to make users follow accounts or post tweets without knowing. The attack page showed a game with invisible Twitter buttons underneath clickable game elements.

How to Prevent It

  • Set both X-Frame-Options: DENY and CSP frame-ancestors 'none' headers
  • Add JavaScript frame-busting as a secondary defense only (headers are the real protection)
  • Pay special attention to settings, payment, and permission-granting pages
  • Test by trying to embed your site in an iframe — it should refuse

Affected Technologies

Next.jsnodejsjavascript

Data Hogo detects this vulnerability automatically.

Scan Your Repo Free

Related Vulnerabilities