How to Detect and Prevent a Clickjacking Attack

What is clickjacking?

Clickjacking is a malicious attack on a webpage that gets a user to click on something different from what they intended. A clickjacking attack is also called user interface (UI) redressing. This is because the attacker “redresses” the interface seen by the user with an invisible frame that tricks them into doing things they wouldn’t ordinarily do.

This article will help you understand what clickjacking is, how you can detect it, and how you can prevent these attacks from affecting your website and its users.

The most common method of clickjacking

The most common type of clickjacking attacks are called overlay attacks. These are made possible by invisible frames (iframes) in which attackers cover a legitimate-looking web page with an interface that the user cannot see, for malicious purposes. 

Used properly, iframes have many legitimate uses. For example, an iframe may be used to embed a video from Vimeo or YouTube into a blog post or other page of your website. The video can be played right from the page because it lives in an iframe. 

In clickjacking, an iframe is used to make a user believe they are clicking one thing (downloading a PDF, for example) when they are actually doing something else (such as making an unintended purchase or downloading malware).

Overlays are not the only way to execute a clickjacking attack, but the end result of any type of clickjacking attack is that the user is tricked into unintended actions by malicious elements disguised as legitimate ones.

How does a clickjacking attack work?

Attackers may use several variations when designing a clickjacking attack, but here is one classic example of how an attack may play out.

1. An attacker creates a malicious dummy website 

   A clickjacker creates a malicious page (e.g., dummy.com) and includes an iframe containing the target website (a legitimate site, e.g., legit.com). Using styling, the iframe will be set to be invisible and positioned in a way that the invisible button in legit.com is located directly on top of a dummy button on dummy.com. This way, when the user clicks on the dummy button they see, they’re actually clicking on the invisible button.

    

2. Victims visit the webpage

   With their dummy web page in place, attackers typically use social engineering tactics, such as fraudulent emails, to entice victims to visit. The emails may tell victims they have won a prize or make them some irresistible offer to draw them in.

    

3. Unintended action is executed

   Once the attacker has tricked a victim into visiting the website, the victim clicks to claim a bogus offer or perform some other action. When they do, the action the attacker intended, rather than what the victim intended to do, is executed by the victim’s browser.

    

How to detect clickjacking

Technically speaking, any website that is open to being embedded in an iframe may be vulnerable to clickjacking attacks. This is why it’s so important for both website administrators and end users to be proactive in preventing them.

So how can you test your site’s vulnerability to clickjacking? One method is to code a specific page of HTML and use it to try to embed a sensitive page of your site in an iframe. The OWASP provides a sample of HTML code to perform this test. 

Most methods for protecting against clickjacking rely on the origin of the page — i.e., the fact that the domain of the malicious page is different from the domain of the legitimate page (e.g., dummy.com vs. legit.com). So when running this test page, it’s best not to run it under the same domain as the targeted page (e.g. legit.com). 

Once you run the HTML, it should tell you whether the page you are testing is vulnerable to clickjacking. With further testing, you can determine whether any protections already in place on the page could be evaded by a clickjacking attack.

How to prevent clickjacking

You can defend your website against clickjacking attacks via client-side or server-side prevention.

Client-side prevention

From the client side, there are three main methods of clickjacking prevention, all related to browsers.

Intersection observer API

While you may not be able to control what browsers your users are using, most modern browsers already support Intersection Observer API. This Javascript API allows detecting the visibility of target elements. It lets a webpage “know” if a specific component in the page, or the entire page, is visible to the user. This knowledge can be used to identify whether the content of a web page is invisible to the user (even if contained within an iframe).

Browser add-ons

There are also a handful of browser add-ons designed to guard against clickjacking, including NoScript and NoClickjack. These add-ons are not compatible with every browser, but their availability is on the rise.

Frame busting

Frame busting is the practice of using JavaScript to keep a web page from being loaded in a frame. It’s effective even in legacy browsers that don’t support newer methods such as the Intersection Observer API or the X-Frame-Options header & CSP mentioned below. 

Note: Frame Busting is exposed to being overridden by the containing, dummy, page.

Server-side prevention

Coming from the server side, there are several ways to guard against clickjacking. Where possible, it’s best to use more than one method to improve your defenses.

X-Frame-options header

This frame option can be added to HTTP as a response header. The HTTP response header is designed to allow the server to tell the client (web browser) if the specific page is allowed to be shown within an iframe. Most major browsers enforce this restriction. Once the website administrator establishes the X-Frame-Options of the site, the header will enforce one of the following framing policies as designated:

• SAMEORIGIN: only framing from the same website(s) is allowed

• DENY: all framing is forbidden

X-Frame-Options is an older alternative and became obsolete by the Content Security Policy standard (covered below), yet it is still supported by modern browsers.

Frame-ancestors directive in content security policy

The frame-ancestors directive is designed to replace the X-Frame-Options header. As part of Content Security Policy (CSP), the frame-ancestors directive can either allow or disallow framed content from being embedded. On pages that include both the X-Frame-Options header and frame-ancestors directive, the frame-ancestors policy is usually given preference by the browser.

SameSite cookie attribution

While SameSite cookie attribution is usually used to defend a site against cross-site request forgery (CSRF), it can also help fend off clickjacking. It prevents a cookie from being sent in case the request originated from a third party. For clickjacking, this means that even if the webpage was shown in an iframe and the victim did click on a button unintentionally, any cookie that should normally be sent with the request following the click will not be sent (for example, a session cookie).

Beware of social engineering

If users can avoid falling victim to social engineering, clickjacking attacks will be less successful. Following a handful of common-sense rules can help users keep safe from the social engineering tactics that hackers use to prey on them:

• Don’t click on pop-ups, especially on sites you don’t use regularly. Many of them are malicious.
  
  

• Pay attention to any browser warnings on the sites you visit. If you are warned not to proceed, don’t.
  
  

• Don’t click a link in any email from an unfamiliar source. Before clicking a link that looks trustworthy, check for spelling errors and note whether it’s an HTTP or HTTPS link. Most trustworthy sites use HTTPS.
  
  

• Text-based clickjacking is becoming more common. Do not click any links in a text from an unknown sender.

If employed by your organization, multi-factor authentication can help guard against social engineering. Keep in mind that this is mainly relevant to workforce users, since CIAM platforms cannot count on educating their customers to beware of social engineering.

Would-be attackers are relentless in their efforts to compromise your system across multiple attack vectors. To defend your organization and its users, you must be just as vigilant about improving your cybersecurity posture. Learn more about how PingOne helps mitigate your risk by combining online fraud detection, identity proofing, and access management with a low or no-code solution.