Facebook and Clickjacking Attack -
Check If Your Website is Vulnerable

Damian Pawłowski Head of Frontend

Could a popular website, developed by a large team of developers and used by millions of users worldwide, be vulnerable to a clickjacking attack? 
– Unfortunately, yes.

This was the case with Facebook, which for a long time was vulnerable to this attack, it even had its own name – “likejacking”. In this article, I will explain to you what a clickjacking attack is and what methods you can use to protect your app against it.

If you prefer to see a short video about this topic – check out our content on YouTube about Clickjacking in the React application:

Clickjacking is a type of web attack where an attacker tricks a user into clicking on something that they did not intend to click on. One example of a clickjacking attack on Facebook was the “Likejacking” attack. In this attack, the attacker would create a webpage that would appear to contain a legitimate Facebook “Like” button. However, when the user clicked on the button, they would actually be activating a hidden action, such as sharing a malicious link on their Facebook profile or even “liking” a page that they did not intend to.

In the video posted above, I show what the process of layering one application on top of another looks like.

Clickjacking example

The attacker would typically use social engineering techniques, such as enticing the user with a sensational headline or offer, to encourage them to click on the fake button. Because the fake button was layered over the real button, the user would inadvertently activate the hidden action.

This type of attack is often designed to allow the attacker to trigger user actions on the target website, even if anti-CSRF tokens are used. Testing should be performed to determine whether websites are vulnerable to clickjacking attacks.

Check if your website is vulnerable to clickjacking attack

If you want to check if your app is vulnerable, create any local application and try to insert your app via iframe. This way you can check if the page becomes visible or if you get an error in the console. The simplest possible way is to create .html file and insert this code inside: 

        <title>Clickjacking attack test</title>
        <iframe src="LINK_TO_YOUR_WEBSITE" width="600" height="600"></iframe>
Remember to replace LINK_TO_YOUR_WEBSITE with your actual link to the website.

Clickjacking defense

There are three main possible mechanisms that can be used to defend against Clickjacking:

  • Recommended way: Preventing browser from loading a website in frame using the X-Frame-Options or Content Security Policy HTTP headers
  • Preventing cookies from being included when the app is loaded in a frame using the SameSite cookies attribute (The use of this attribute should be considered as part of a defence-in-depth approach)
  • Using Javascript code called “frame-buster” to prevent load website in a iframe

Example of using Content-Security-Policy:

Content-Security-Policy: frame-ancestors 'none'; 
This prevents any domain from framing the content of your app. With this setting any website can’t display your app with iframe. 

Content-Security-Policy: frame-ancestors 'self'; 
This setting will allow display your app only inside your domain.

If you want to support even outdated browsers, you should use several methods to reduce the risk as much as possible.

Facebook has implemented various countermeasures over the years to prevent clickjacking attacks, such as using frame-busting scripts and X-Frame-Options headers to prevent third-party sites from embedding app content in an iframe. 

Check if your application is safe. Every additional, even small layer of security makes a big difference.