Clickjacking
Last updated: January 16, 2026
Clickjacking tricks users into clicking hidden elements by overlaying transparent iframes over legitimate-looking pages, enabling unauthorized actions.
Scan for This VulnerabilityWhat is Clickjacking?
An attacker creates a page with an invisible iframe containing your site. They position the iframe so that when users click what appears to be the attacker's button, they're actually clicking a button on your site - like 'Delete Account' or 'Transfer Money'.
Why It's Dangerous
This vulnerability can allow attackers to access sensitive data, compromise user accounts, or gain unauthorized control over your application. In AI-generated code, this issue is particularly common because security measures are often deprioritized in favor of rapid feature development.
Why AI Code Is Vulnerable
AI code generation tools focus on producing functional code quickly. They often generate patterns that work correctly but lack the defensive measures experienced security engineers would implement. This makes clickjacking particularly prevalent in vibe-coded applications.
Understanding the Technical Details
Clickjacking is classified as a medium-severity vulnerability because of its potential to cause significant damage to your application and users. Understanding the technical mechanics helps you recognize and prevent this issue in your own code.
This vulnerability typically occurs when security controls are either missing entirely, improperly configured, or incorrectly implemented. In many cases, the code appears to work correctly during development and testing, but the security flaw becomes exploitable once the application is deployed and accessible to malicious actors.
Attackers actively scan for this type of vulnerability using automated tools. Once discovered, exploitation can be rapid—often within hours of your application going live. The consequences range from data theft and account takeover to complete system compromise depending on the application's architecture.
For vibe-coded applications built with platforms like Lovable, Bolt.new, Replit, or v0.dev, this vulnerability appears in roughly 20-40% of deployments according to security research. The AI-generated patterns often follow insecure defaults that require manual security hardening.
How It Happens
- Missing X-Frame-Options header
- Missing Content-Security-Policy frame-ancestors
- Inadequate frame-busting scripts
- Allowing framing from untrusted origins
Impact
Unauthorized actions performed by users
Likejacking (unwanted social media actions)
Account takeover through settings changes
Data theft through form submissions
How to Detect
- Check for X-Frame-Options header
- Test if site can be embedded in iframe
- Verify CSP frame-ancestors directive
- Run VAS to detect clickjacking vulnerabilities
How to Fix
Set X-Frame-Options header
Prevent your site from being framed.
// DENY - never allow framing
X-Frame-Options: DENY
// SAMEORIGIN - only allow same-origin framing
X-Frame-Options: SAMEORIGINUse CSP frame-ancestors
Modern alternative with more control.
// Don't allow any framing
Content-Security-Policy: frame-ancestors 'none';
// Allow same origin only
Content-Security-Policy: frame-ancestors 'self';
// Allow specific origins
Content-Security-Policy: frame-ancestors 'self' https://trusted.com;Next.js/Vercel configuration
Add headers in next.config.js
module.exports = {
async headers() {
return [{
source: '/:path*',
headers: [
{ key: 'X-Frame-Options', value: 'DENY' },
{ key: 'Content-Security-Policy', value: "frame-ancestors 'none'" },
],
}];
},
};Commonly Affected Platforms
Prevention Best Practices
The most effective approach to clickjacking is prevention. Implementing security measures during development is significantly easier and less costly than remediating vulnerabilities after deployment.
Security-First Development
When using AI code generation tools, always review the generated code for security implications. AI tools prioritize functionality over security, so treat all generated code as requiring security review. Establish a checklist of security requirements specific to your application type and verify each before deployment.
Continuous Security Testing
Integrate security scanning into your development workflow. Run scans after major code changes, before deployments, and on a regular schedule for production applications. Early detection of vulnerabilities reduces remediation costs and prevents potential breaches.
Defense in Depth
Never rely on a single security control. Implement multiple layers of protection so that if one control fails, others still protect your application. For example, combine authentication, authorization, input validation, and output encoding to create comprehensive protection against attacks.
Stay Informed
Security threats evolve constantly. Follow security researchers, subscribe to vulnerability databases, and monitor your dependencies for known issues. Understanding emerging threats helps you proactively protect your applications before attackers exploit new techniques.
Is Your App Vulnerable?
VAS automatically scans for clickjacking and provides detailed remediation guidance with code examples. Our scanner specifically targets vulnerabilities common in AI-generated applications.
Scans from $5, results in minutes. Get actionable results with step-by-step fix instructions tailored to your stack.
Get Starter ScanFrequently Asked Questions
Is X-Frame-Options or CSP better?
Use both. CSP frame-ancestors is more flexible and the modern standard, but X-Frame-Options provides fallback for older browsers. They work together - if both are present, CSP takes precedence in supporting browsers.
What if I need to allow framing for widgets?
Use CSP frame-ancestors to whitelist specific origins: frame-ancestors 'self' https://partner.com. For sensitive pages (login, settings), always use 'none' or 'self'. Consider using postMessage for cross-origin widget communication instead of iframes.