Clickjacking

What Is Clickjacking?

Clickjacking also known as UI redress attack or user interface manipulation, is a deceptive technique used by malicious individuals to trick you into clicking on something different from what you perceive. This vulnerability occurs when an attacker overlays transparent layers or elements over legitimate website content, effectively hijacking your clicks.

How does clickjacking work?

Imagine visiting a website that appears normal and trustworthy. However, unbeknownst to you, there are hidden elements on the page that are not visible to the naked eye. These elements could be buttons, links, or even entire forms strategically placed over legitimate content. When you click on what you think is a harmless button or link, you are actually interacting with the hidden malicious element underneath.

Real Life Example Scenario

Imagine you’re browsing a legitimate news website where a video player is embedded. Unbeknownst to you, an attacker has overlaid an invisible iframe over the “play” button of the video. When you click on what appears to be the play button to watch the video, you’re actually clicking on a hidden button that subscribes you to a premium SMS service. This action charges your phone bill without your consent, demonstrating how clickjacking can be used to deceive users into unintended actions.

Impact of Clickjacking:

Unauthorized Actions: Clickjacking can lead to unintended actions such as liking a social media post, sharing content, making purchases, or even transferring funds without the user’s knowledge or consent.

Data Theft: It can be used to steal sensitive information by tricking users into entering confidential data such as passwords, credit card details, or personal information into disguised forms.
Malware Installation: Clickjacking can exploit users to inadvertently download malicious software or grant permissions that compromise device security.
Phishing Attacks: Attackers can create convincing phishing scenarios where users unknowingly interact with malicious content, leading to disclosure of personal information or further exploitation.
Financial Loss: Users may incur financial losses through unauthorized transactions or subscriptions initiated via clickjacking.
Reputation Damage: Websites and businesses can suffer reputational harm if their platforms are exploited for clickjacking, leading to loss of trust among users.

Understanding Clickjacking: How It Works and How to Prevent It:

Clickjacking Example Code:

<!DOCTYPE html>
<html>
<head>
    <title>Clickjack Test Page</title>
</head>
<body>
    <p>This page demonstrates a clickjacking attack.</p>
    <!-- The iframe below embeds another website within this page -->
    <iframe src="https://www.example.com" width="500" height="500" style="opacity: 0; position: absolute; top: 0; left: 0; z-index: 999;"></iframe>
    <button style="position: relative; z-index: 1000;" onclick="alert('Button clicked!')">Click Me!</button>
</body>
</html>

Example of a Clickjacking Attack in Action:

In this example:

The iframe is set to be invisible (opacity: 0) and positioned on top of the “Click Me!” button.
The “Click Me!” button has a higher z-index to ensure it appears above the iframe.
When the “Click Me!” button is clicked, it triggers an onclick event that shows an alert.

When you click the “Click Me!” button, you will only see the alert message from the button click. In a real attack, the invisible iframe might contain a button or link that the attacker wants the victim to click unknowingly. This could lead to unwanted actions on the target site within the iframe.

If the iframe src is set to a website you control or one that has a button or action, you will see how the clickjacking can manipulate user clicks. For safety and ethical reasons, do not use real websites without permission. Use a controlled environment or a test site you own.

Preventing Clickjacking:

To prevent clickjacking, websites can use the following HTTP headers:

X-Frame-Options: This header allows a site to control whether its content can be embedded in iframes on other sites. It can be set to DENY, SAMEORIGIN, or ALLOW-FROM uri.

X-Frame-Options: DENY

Content-Security-Policy (CSP): This header can be used to specify allowed sources for content including frames.

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

By implementing these headers, websites can significantly reduce the risk of clickjacking attacks.

Conclusion:

Clickjacking is a serious web security vulnerability that can lead to unintended actions by users, compromising their data and the integrity of web applications. Understanding how clickjacking works is crucial for developers and website administrators to implement effective countermeasures. By using techniques such as frame-busting scripts, implementing the X-Frame-Options header, and educating users about the risks, you can significantly reduce the likelihood of clickjacking attacks. Protecting your web applications from such threats not only safeguards your users but also helps maintain the trust and reputation of your online presence.