Bugnexa
LoginGet Started

Implementation Guide

Fix Clickjacking Vulnerability

A comprehensive guide with code snippets and configuration examples for developers and system administrators.

Introduction

Clickjacking is caused by allowing third-party websites to embed your site using an iframe. To fix this vulnerability, you need to set HTTP headers that instruct browsers not to allow your website to be iframed.

There are three main solutions to prevent clickjacking:

X-Frame-Options

Traditional header for basic protection

CSP

Modern header with granular control

Frame-Busting

JavaScript to escape iframes

X-Frame-Options

X-Frame-Options is a response header that controls whether a browser should render your page in an iframe. Set it to one of the following values:

DENY

No site can load your page in a frame.

X-Frame-Options: DENY

SAMEORIGIN

Only same-origin sites can frame your page.

X-Frame-Options: SAMEORIGIN

Note: The Content-Security-Policy frame-ancestors directive is the modern replacement for X-Frame-Options.

Content-Security-Policy

The CSP frame-ancestors directive specifies valid parents that may embed a page using an iframe. This is the recommended modern approach.

'none'

No site can frame your page.

Content-Security-Policy: frame-ancestors 'none';

'self'

Only same-origin can frame your page.

Content-Security-Policy: frame-ancestors 'self';

Specific Domain

Allow specific trusted domain.

Content-Security-Policy: frame-ancestors https://trusted.com;

Frame-Busting JavaScript

Use JavaScript to check if your page is embedded in an iframe and escape if necessary. Add this code to your HTML head section.

<style>
  html { display: none; }
</style>
<script>
  if (self == top) {
    document.documentElement.style.display = &apos;block&apos;;
  } else {
    top.location = self.location;
  }
</script>

Node.js Implementation

response.setHeader("X-Frame-Options", "DENY");
response.setHeader("Content-Security-Policy", "frame-ancestors &apos;none&apos;");

Java Implementation

public void doGet(HttpServletRequest request, HttpServletResponse response) {
  response.addHeader("X-Frame-Options", "DENY");
  response.addHeader("Content-Security-Policy", "frame-ancestors &apos;none&apos;");
}

PHP Implementation

&lt;?php
header("X-Frame-Options: DENY");
header("Content-Security-Policy: frame-ancestors &apos;none&apos;");

Apache Configuration

1. Enable mod_headers

a2enmod headers

2. Add to your VirtualHost config

Header set X-Frame-Options "DENY"
Header set Content-Security-Policy "frame-ancestors &apos;none&apos;"

3. Restart Apache

sudo service apache2 restart

Nginx Configuration

Add to your server block

add_header X-Frame-Options "DENY";
add_header Content-Security-Policy "frame-ancestors &apos;none&apos;";

Restart Nginx

sudo service nginx restart

WordPress Configuration

Add to wp-config.php

header(&apos;X-Frame-Options: SAMEORIGIN&apos;);
header("Content-Security-Policy: frame-ancestors &apos;self&apos;");

Test Your Fix

Verify your clickjacking protection is working correctly.