Manual Testing for Clickjacking in Web Applications

In this installment of our Learn Pentesting series, we’re diving deep into clickjacking—a subtle yet dangerous attack vector in web applications. In this post, we’ll cover what clickjacking is, how it works, and provide you with practical, hands-on techniques to manually test for clickjacking vulnerabilities during your penetration tests.

Understanding Clickjacking

Clickjacking is a UI redress attack that tricks a user into clicking on something different from what they perceive, thereby potentially executing malicious actions without their consent. The attacker typically embeds a target website or web element within an invisible or disguised iframe, overlaying it with a deceptive interface element. This can lead to unauthorized actions such as triggering downloads, changing settings, or even making unwanted financial transactions.

Mechanics of a Clickjacking Attack

A typical clickjacking attack involves:

Embedding the target site in an iframe: The attacker creates a malicious webpage that loads the victim’s webpage within an iframe.
Manipulating the UI: The attacker overlays their own UI elements or transparent layers on top of the iframe.
User deception: The unsuspecting user interacts with the malicious page, unknowingly clicking on elements within the iframe.

For example, imagine a scenario where a “Play” button on a video is overlaid by a transparent “Submit” button of another service. The user’s intention to play a video might inadvertently trigger an action on the other service.

Mitigation Techniques

Modern web applications employ several techniques to mitigate clickjacking:

X-Frame-Options Header:
This HTTP header instructs the browser on whether to allow a page to be framed. Common directives include:
- DENY: Prevents the page from being displayed in an iframe.
- SAMEORIGIN: Allows framing only if the parent page is from the same origin.
Content Security Policy (CSP) - frame-ancestors Directive:
This directive provides a more flexible and robust solution compared to X-Frame-Options. It specifies which origins are allowed to embed the page in an iframe.

During manual testing, you’ll want to verify that these headers are properly implemented and that they’re effectively preventing unauthorized framing.

Manual Testing Methodology

Manual testing for clickjacking typically involves creating a controlled test page that attempts to frame the target application. Here’s a step-by-step guide to perform these tests.

Preparing a Test Environment

Local Web Server Setup:
For testing, you can serve your test page from a local web server. If you have Python installed, you can quickly set up a simple HTTP server:
```
# Python 3.x
python3 -m http.server 8080
```
Navigate to http://localhost:8080 to access your test page.
Browser Developer Tools:
Have your browser’s developer tools open to inspect network traffic and HTTP headers. This will help you verify if the target page is sending the correct X-Frame-Options or CSP headers.

Creating a Clickjacking Test Page

Craft a simple HTML page that embeds the target website within an iframe. Below is a sample test page:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Clickjacking Test Page</title>
  <style>
    body {
      margin: 0;
      font-family: sans-serif;
      text-align: center;
    }
    header {
      padding: 1em;
      background-color: #f4f4f4;
      border-bottom: 1px solid #ccc;
    }
    iframe {
      width: 100%;
      height: 600px;
      border: none;
    }
    .overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 600px;
      background: rgba(255, 255, 255, 0.2);
      pointer-events: none;
    }
  </style>
</head>
<body>
  <header>
    <h1>Clickjacking Test Page</h1>
    <p>This page attempts to load the target website in an iframe.</p>
  </header>
  <div style="position: relative;">
    <iframe src="http://target-website.com"></iframe>
    <!-- Overlay to simulate UI manipulation -->
    <div class="overlay"></div>
  </div>
  <script>
    // Basic logging to see if the iframe has loaded.
    const iframe = document.querySelector('iframe');
    iframe.addEventListener('load', () => {
      console.log('Target website loaded in iframe.');
    });
  </script>
</body>
</html>

Testing Steps:

Access the Test Page:
Open your test page in a browser. If the target page is vulnerable, it should load within the iframe. If the target page has proper protections (e.g., X-Frame-Options: DENY), you’ll see an error or a blank frame.
Inspect HTTP Headers:
Use your browser’s network tab to check the response headers for the target page. Look for:
- X-Frame-Options: Ensure it’s set to DENY or SAMEORIGIN.
- Content-Security-Policy: Check if the frame-ancestors directive is properly configured.
Interactive Testing:
Optionally, add interactive elements (e.g., a button) within the overlay div to simulate a user action. Monitor if any clicks are “captured” by the hidden iframe. This can help validate the real-world impact if an attacker bypassed the frame protections.

Testing with Browser Developer Tools and Proxies

Manual testing can be further enhanced using proxies like Burp Suite or OWASP ZAP:

Intercept and Modify Headers:
Temporarily modify or remove the X-Frame-Options or CSP headers to see if the page becomes vulnerable when protections are disabled. This controlled modification helps in understanding the risk and potential impact.
JavaScript Console Debugging:
Utilize the browser’s console to check if there are any errors when the page is framed. Modern browsers often log security violations related to framing in the console.

Additional Considerations

Clickjacking Beyond iFrames:
While iframes are the most common vector, clickjacking can also be performed using other techniques such as CSS tricks (e.g., using opacity and z-index) to overlay UI elements. Consider testing these scenarios if you suspect unconventional framing techniques.
Edge Cases:
Some web applications might allow framing on certain pages while protecting sensitive pages (e.g., admin panels). Ensure your testing covers multiple endpoints within the target application.
Automated Tools:
While manual testing is crucial for deep technical validation, consider complementing your tests with automated scanners that specialize in detecting clickjacking vulnerabilities. Compare results to ensure nothing is missed.

Conclusion

Clickjacking remains a significant threat due to its subtle approach to tricking users into unintended actions. Through careful manual testing—by framing the target website in a controlled environment, inspecting HTTP headers, and manipulating the UI—you can accurately assess the resilience of a web application against such attacks.

Remember, the key to effective pentesting is not only detecting vulnerabilities but also understanding the underlying mechanics of each attack vector. We hope this guide serves as a comprehensive reference for your future assessments.

Happy testing, and stay secure!