Panel Discussion: API Security in DevSecOps. Register Now

Panel Discussion: API Security in DevSecOps. Register Now

Panel Discussion: API Security in DevSecOps. Register Now

Clickjacking: Understanding vulnerability, attacks and prevention

Clickjacking ( UI redressing) is a type of attack where a malicious website tricks a user into clicking on something different from what they intended

Author image

Medusa

10 mins

Clickjacking vulnerability
Clickjacking vulnerability
Clickjacking vulnerability

What is Clickjacking (UI redressing)?

Clickjacking is a type of attack where a malicious website tricks a user into clicking on something different from what they intended. The attacker can then take control of the user's actions, potentially leading to unauthorized actions or data exposure.

Importance of safeguarding against it

Clickjacking is a serious threat to internet users as it can lead to unauthorized actions being taken on their behalf and can also expose sensitive data. The impact of a clickjacking attack can range from mere inconvenience to severe damage to reputation, finances, and even personal safety.

For instance, if a user is tricked into clicking on a button that initiates a transfer of funds from their bank account, they could lose a significant amount of money. Similarly, if a user clicks on a link that exposes their personal information, such as their login credentials, the attacker could use that information to access other accounts or steal their identity.

Furthermore, clickjacking attacks are becoming increasingly sophisticated and can be difficult to detect. Cybercriminals are constantly developing new techniques to evade detection and trick users into clicking on malicious links. Therefore, taking necessary precautions to protect against clickjacking, such as using security headers, being cautious with links and unfamiliar sites, and using anti-clickjacking browser extensions to prevent such attacks are imperative.

In today's digital age, where we rely on the internet for almost every aspect of our lives, safeguarding against clickjacking is more critical than ever. It is essential to be aware of the risks and consequences associated with clickjacking and take necessary steps to protect ourselves and our information from such attacks.

Explanation of Clickjacking attacks

Clickjacking Example 1:

Let’s give these two sites a name:

Malicious Site: Page A

Legitimate Site: Page B

  • The attacker creates a malicious webpage (Page A) with an innocent-looking element, like a game, a button, or a video.

  • The attacker positions "Page B" above a malicious webpage (Page A) using techniques like transparent iframes or CSS styling.

  • The user actually visits MaliciousPage, not knowing that LegitPage is overlayed on top of it. The user interacts with the element on "MaliciousPage" (e.g., clicks a button, plays a game). However, unbeknownst to the user, their interaction is actually being performed on the hidden "Legitimate Page" element, not the real content of "Malicious Page."

  • Because the user thinks they're interacting with a normal page, they inadvertently perform actions they didn't intend. For example, making unauthorized purchases on an e-commerce site or making a transaction on a banking site.

Clickjacking Example 2:

Let's say a user is browsing a social media site where they see a link to a funny video. They click the link and are taken to a page that seems to show the video, but is actually a clickjacking attack.

  • LegitPage: The actual social media page with the funny video link.

  • MaliciousPage: The attacker's webpage with the video link.

Steps in Action:

  1. The user clicks the "play" button on the video, believing they're interacting with the legitimate video link on the malicious page.

  2. In reality, the "play" button is part of the legitimate site overlaid on the attacker’s site.

  3. The click triggers an action on "Legitimate Page," which could be liking a post or sharing something without the user's consent.

  4. The user's action is completed on the hidden "Legitimate Page," and they're left unaware that they've interacted with anything other than the normal video link.

This way, the attacker can exploit the user's trust and deceive them into performing actions they didn't intend to, potentially compromising their account or sharing unauthorized information.

Types of Clickjacking

  • Likejacking: The attacker tricks the user into clicking on a hidden "Like" button, causing them to "like" content they did not intend to.

  • Cursorjacking: The attacker moves the user's mouse cursor to a hidden element, causing them to click on it without realizing it.

  • Content extraction: The attacker extracts sensitive information from a website, such as passwords, by overlaying an invisible iframe on top of the login form and capturing keystrokes.

Test if your website is vulnerable

Testing whether your website is vulnerable to clickjacking involves simulating a clickjacking attack to see if your site's content can be overlaid or manipulated by external malicious elements. Here's a step-by-step guide on how to test for clickjacking vulnerabilities:

Manual Testing

  1. Identify the Target Page: Choose a specific page on your website that you want to test for clickjacking vulnerabilities.

  2. Create an Attacker Page:

    • Create a simple HTML page (attacker.html) that contains an iframe element with the src attribute set to your target page. This will simulate the attacker's webpage overlaying your content.

  3. Adjust the CSS (Optional):

    • Use CSS to position the iframe over your content. You can set the iframe's position to "absolute," adjust its opacity, or apply other styles to make it less visible.

  4. Test the Attack:

    • Open the attacker.html page in a web browser and observe whether the iframe overlays your target page's content. If your content is obscured or manipulated by the iframe, your website is vulnerable to clickjacking.

Clickjacking Prevention

Using security headers (X-Frame-Options, CSP)

Using security headers like X-Frame-Options and Content Security Policy (CSP) can help protect applications from clickjacking attacks.

X-Frame-Options is a security header that can be used to control how a website can be embedded within an iframe. By setting the X-Frame-Options header to "DENY" or "SAMEORIGIN," a website can prevent itself from being loaded within an iframe on a different domain or only allow it to be loaded within iframes on the same domain.

CSP is another security header that can be used to prevent clickjacking attacks. It allows web developers to define a policy that specifies which resources the browser should be allowed to load and execute. By specifying the "frame-ancestors" directive within the CSP policy, a website can control which domains are allowed to embed it within an iframe.

Together, X-Frame-Options and CSP can help prevent clickjacking attacks by ensuring that a website is only loaded within iframes on trusted domains and not within iframes on malicious or untrusted domains.

Being cautious with links and unfamiliar sites

Being cautious with links and unfamiliar sites is an important step in protecting against clickjacking attacks. It's essential to verify the legitimacy of a website before clicking on any links or interacting with any content. Here are some tips to help you stay safe:

  • Be wary of links from unknown or suspicious sources, especially those that ask you to log in or provide personal information.

  • Check the URL of the website to ensure that it matches the legitimate site you intend to visit.

  • Use a link preview tool to see a preview of the website before clicking on the link.

  • Install browser extensions that can help detect and block malicious links and content.

  • Use caution when downloading files or software from unfamiliar sites, as these can sometimes be disguised as legitimate applications or updates.

By being vigilant and taking necessary precautions, you can protect yourself from clickjacking attacks and keep your personal information and accounts secure.

Want the best proactive API Security product?

Our customers love us for our proactive approach and world class API Security test templates. Try Akto's test library yourself in your testing playground. Play with the default test or add your own.

Want the best proactive API Security product?

Our customers love us for our proactive approach and world class API Security test templates. Try Akto's test library yourself in your testing playground. Play with the default test or add your own.

Want the best proactive API Security product?

Our customers love us for our proactive approach and world class API Security test templates. Try Akto's test library yourself in your testing playground. Play with the default test or add your own.

Anti-Clickjacking browser extension

Various browser extensions exist to counteract clickjacking attempts, though they often compromise the user experience by disabling all JavaScript within loaded pages. This can lead to issues on widely used platforms such as Facebook, Twitter, and YouTube, which heavily rely on JavaScript for their functionality. These browser plugins hinder the proper functioning of these platforms. To ensure the smooth operation of JavaScript-dependent applications on trusted origins, it's necessary to define an explicit list of permitted sources. Notable examples of browser extensions that obstruct JavaScript execution across different browsers encompass:

  1. ChromeGuard for Google Chrome

  2. NoScript for Mozilla Firefox

  3. SafariScriptBlocker for Safari

Clickjacking CVES:

  1. https://nvd.nist.gov/vuln/detail/CVE-2021-35237

  2. https://nvd.nist.gov/vuln/detail/CVE-2022-3260

Clickjacking example with Practical Demonstration

There is an application that allows users to donate money by clicking on the “pay” button. This is what it looks like:

Legit website used to donate money

Legit website used to donate money

This application is vulnerable to a clickjacking attack, let’s see how.

Attacker’s code:

<html>
<head> 
      
    <title>Exploit</title> 
  
    <style>
    #vulnerable_site { 
        position:relative; 
        opacity:0; 
        z-index:2; 
      
    } 
    #overlay { 
        margin-left: 10px; 
        position:absolute; 
        z-index:1;       
    } 
    </style> 

</head> 
  
  
<body> 
<div id="overlay"> 
<p>To win $1000, click the button below!</p><br>
<form action="#"> 
<input type="submit" value="WIN!">
</form> 
</div> 
  
<iframe id="vulnerable_site" src="<http://example.com/frameable.html>"></iframe> 
</body> 
  
</html>

The code reveals that the attacker is employing an iframe technique to embed a legitimate link from another website and host it on their server.

Legit website used to donate money

Attacker’s site

In this case, the website advertises the opportunity to win $1000 by clicking on the "win" button. However, what regular users may not know is that there is another button hidden in front of the "win" button. If the opacity is increased slightly, the hidden button becomes visible, but in an attack scenario, its opacity is set to 0.

Attacker’s site

Hidden iframe in attacker’s site

Users may unwittingly click on the "win" button, but instead of winning, the money will be donated without their knowledge.

Conclusion

In conclusion, clickjacking is a serious threat to internet users that can lead to unauthorized actions and sensitive data exposure. It is essential to safeguard against clickjacking by understanding how it works, identifying vulnerabilities, and taking necessary precautions to protect against it. Web developers can implement security headers like X-Frame-Options and Content Security Policy (CSP) to prevent clickjacking attacks. Users can also be cautious with links and unfamiliar sites, use anti-clickjacking browser extensions, and verify the legitimacy of a website before interacting with it. By being vigilant and taking necessary precautions, users can protect themselves from clickjacking attacks and keep their personal information and accounts secure.

Learn More: If you want to know more about keeping your API endpoints safe and secure, take a look at Akto. Find out how we can help protect your API endpoints from bad actors and unauthorized access.

Want to ask something?

Our community offers a network of support and resources. You can ask any question there and will get a reply in 24 hours.

Want to ask something?

Our community offers a network of support and resources. You can ask any question there and will get a reply in 24 hours.

Want to ask something?

Our community offers a network of support and resources. You can ask any question there and will get a reply in 24 hours.

Follow us for more updates

Experience enterprise-grade API Security solution