Coders Conquer Security: Share & Learn Series - Clickjacking
Susie opens her email to escape from a nasty report that's due in two days. She sees a link for a free iPad appear in her inbox. After clicking it, she goes to a website with a large banner page reading, "Click here for your free iPad!". She clicks the button but nothing really seems to happen. The problem is, something did happen.
After navigating back to her inbox, she realizes all of her emails have been deleted. She didn't even hit "delete'on any of them. What's going on?
The email site was clickjacked. Clickjacking tricks users into performing actions they didn't intend to perform, and it can lead to serious problems.
Let's take a look now at how clickjacking works, why it's dangerous, and what developers like you can do to prevent it:
Understand Clickjacking
Clickjacking, also called a "UI redressing attack", occurs when an attacker uses several transparent layers on a web page to trick the user into clicking on a button or link the user doesn't intend to click on.
Have you ever had a bug stuck in your car? They fly up against the window furiously trying to fly outside. The bug's intention is to fly to what looks like trees and open air, oblivious of the glass blocking its path.
Clickjacking is similar in design, except the user is the bug and your website is the glass blocking the way. The user sees something they want, such as a free iPhone. The attacker places your site inside a transparent frame on top of the free iPhone ad. When the user clicks on the button to grab the allegedly "free'prize, they are actually clicking on a button on your site, performing an action they didn't intend.
Why Clickjacking is Dangerous
What can an attacker do with clickjacking? It largely depends on the functionality of the website in question.
The attacker could get a user to like or share the attacker's site on social media. This can be easily pulled off since many people stay logged into their social media accounts for convenience purposes.
If your site can be placed in a frame, a sensitive operation can be completed by clicking a button, and this can act as an attack vector. For example, a user clicks to get a free iPad but instead changes account settings on your site to make the account less secure. An attack of this type occurred against the Adobe Flash plugin settings page. The settings could be placed in a transparent frame, tricking the user into allowing any Flash animation access to the microphone and camera. Attackers could then record the victim; a major invasion of privacy.
An email client could be framed into a site, causing the user to delete all emails in their mailbox or forward emails to an email address controlled by the attacker.
The bottom line is: the user can't see what they're clicking, so they can be convinced to click anything. Whether it is a social share or downloading malware, the possibilities are vast.
How to Defeat Clickjacking
Clickjacking can be prevented. The recommended way to prevent clickjacking is to define a content security policy, or CSP, for your site. Using the "frame ancestors" HTTP response header, you can control how your site can be framed.
- "frame-ancestors none'- No other site is allowed to frame yours. This is the recommended setting.
- "frame-ancestors self'- Pages in your site can only be framed by other pages within your site.
- "frame-ancestors self <uri list=""> - Your site can be framed by the sites in the URI lists and no others.</uri>
CSP frame-ancestors is not currently supported by all major browsers. Use the "X-Frame-Options" HTTP header as a fallback option for such browsers.
- DENY - No one can frame your site. This is the recommended setting
- SAMEORIGIN - The same as "self'for CSP. You can frame your own content, but no-one else can.
- ALLOW-FROM <uri> - Allow the specified URI to frame your content.</uri>
Don't Get Clickjacked
Clickjacking is a clever, misleading attack that can lead to reputational damage and revenue loss if your product can be manipulated by attackers. Check out our free learning resources to find out more about clickjacking.
Use a Content Security Policy and "X-Frame-Options" header to prevent others from using your site in malicious ways. Don't allow attackers to manipulate your users. Don't get clickjacked.
Let's take a look now at how clickjacking works, why it's dangerous, and what developers like you can do to prevent it.
Jaap Karan Singh is a Secure Coding Evangelist, Chief Singh and co-founder of Secure Code Warrior.
Secure Code Warrior is here for your organization to help you secure code across the entire software development lifecycle and create a culture in which cybersecurity is top of mind. Whether you’re an AppSec Manager, Developer, CISO, or anyone involved in security, we can help your organization reduce risks associated with insecure code.
Book a demo
Jaap Karan Singh is a Secure Coding Evangelist, Chief Singh and co-founder of Secure Code Warrior.
Susie opens her email to escape from a nasty report that's due in two days. She sees a link for a free iPad appear in her inbox. After clicking it, she goes to a website with a large banner page reading, "Click here for your free iPad!". She clicks the button but nothing really seems to happen. The problem is, something did happen.
After navigating back to her inbox, she realizes all of her emails have been deleted. She didn't even hit "delete'on any of them. What's going on?
The email site was clickjacked. Clickjacking tricks users into performing actions they didn't intend to perform, and it can lead to serious problems.
Let's take a look now at how clickjacking works, why it's dangerous, and what developers like you can do to prevent it:
Understand Clickjacking
Clickjacking, also called a "UI redressing attack", occurs when an attacker uses several transparent layers on a web page to trick the user into clicking on a button or link the user doesn't intend to click on.
Have you ever had a bug stuck in your car? They fly up against the window furiously trying to fly outside. The bug's intention is to fly to what looks like trees and open air, oblivious of the glass blocking its path.
Clickjacking is similar in design, except the user is the bug and your website is the glass blocking the way. The user sees something they want, such as a free iPhone. The attacker places your site inside a transparent frame on top of the free iPhone ad. When the user clicks on the button to grab the allegedly "free'prize, they are actually clicking on a button on your site, performing an action they didn't intend.
Why Clickjacking is Dangerous
What can an attacker do with clickjacking? It largely depends on the functionality of the website in question.
The attacker could get a user to like or share the attacker's site on social media. This can be easily pulled off since many people stay logged into their social media accounts for convenience purposes.
If your site can be placed in a frame, a sensitive operation can be completed by clicking a button, and this can act as an attack vector. For example, a user clicks to get a free iPad but instead changes account settings on your site to make the account less secure. An attack of this type occurred against the Adobe Flash plugin settings page. The settings could be placed in a transparent frame, tricking the user into allowing any Flash animation access to the microphone and camera. Attackers could then record the victim; a major invasion of privacy.
An email client could be framed into a site, causing the user to delete all emails in their mailbox or forward emails to an email address controlled by the attacker.
The bottom line is: the user can't see what they're clicking, so they can be convinced to click anything. Whether it is a social share or downloading malware, the possibilities are vast.
How to Defeat Clickjacking
Clickjacking can be prevented. The recommended way to prevent clickjacking is to define a content security policy, or CSP, for your site. Using the "frame ancestors" HTTP response header, you can control how your site can be framed.
- "frame-ancestors none'- No other site is allowed to frame yours. This is the recommended setting.
- "frame-ancestors self'- Pages in your site can only be framed by other pages within your site.
- "frame-ancestors self <uri list=""> - Your site can be framed by the sites in the URI lists and no others.</uri>
CSP frame-ancestors is not currently supported by all major browsers. Use the "X-Frame-Options" HTTP header as a fallback option for such browsers.
- DENY - No one can frame your site. This is the recommended setting
- SAMEORIGIN - The same as "self'for CSP. You can frame your own content, but no-one else can.
- ALLOW-FROM <uri> - Allow the specified URI to frame your content.</uri>
Don't Get Clickjacked
Clickjacking is a clever, misleading attack that can lead to reputational damage and revenue loss if your product can be manipulated by attackers. Check out our free learning resources to find out more about clickjacking.
Use a Content Security Policy and "X-Frame-Options" header to prevent others from using your site in malicious ways. Don't allow attackers to manipulate your users. Don't get clickjacked.
Susie opens her email to escape from a nasty report that's due in two days. She sees a link for a free iPad appear in her inbox. After clicking it, she goes to a website with a large banner page reading, "Click here for your free iPad!". She clicks the button but nothing really seems to happen. The problem is, something did happen.
After navigating back to her inbox, she realizes all of her emails have been deleted. She didn't even hit "delete'on any of them. What's going on?
The email site was clickjacked. Clickjacking tricks users into performing actions they didn't intend to perform, and it can lead to serious problems.
Let's take a look now at how clickjacking works, why it's dangerous, and what developers like you can do to prevent it:
Understand Clickjacking
Clickjacking, also called a "UI redressing attack", occurs when an attacker uses several transparent layers on a web page to trick the user into clicking on a button or link the user doesn't intend to click on.
Have you ever had a bug stuck in your car? They fly up against the window furiously trying to fly outside. The bug's intention is to fly to what looks like trees and open air, oblivious of the glass blocking its path.
Clickjacking is similar in design, except the user is the bug and your website is the glass blocking the way. The user sees something they want, such as a free iPhone. The attacker places your site inside a transparent frame on top of the free iPhone ad. When the user clicks on the button to grab the allegedly "free'prize, they are actually clicking on a button on your site, performing an action they didn't intend.
Why Clickjacking is Dangerous
What can an attacker do with clickjacking? It largely depends on the functionality of the website in question.
The attacker could get a user to like or share the attacker's site on social media. This can be easily pulled off since many people stay logged into their social media accounts for convenience purposes.
If your site can be placed in a frame, a sensitive operation can be completed by clicking a button, and this can act as an attack vector. For example, a user clicks to get a free iPad but instead changes account settings on your site to make the account less secure. An attack of this type occurred against the Adobe Flash plugin settings page. The settings could be placed in a transparent frame, tricking the user into allowing any Flash animation access to the microphone and camera. Attackers could then record the victim; a major invasion of privacy.
An email client could be framed into a site, causing the user to delete all emails in their mailbox or forward emails to an email address controlled by the attacker.
The bottom line is: the user can't see what they're clicking, so they can be convinced to click anything. Whether it is a social share or downloading malware, the possibilities are vast.
How to Defeat Clickjacking
Clickjacking can be prevented. The recommended way to prevent clickjacking is to define a content security policy, or CSP, for your site. Using the "frame ancestors" HTTP response header, you can control how your site can be framed.
- "frame-ancestors none'- No other site is allowed to frame yours. This is the recommended setting.
- "frame-ancestors self'- Pages in your site can only be framed by other pages within your site.
- "frame-ancestors self <uri list=""> - Your site can be framed by the sites in the URI lists and no others.</uri>
CSP frame-ancestors is not currently supported by all major browsers. Use the "X-Frame-Options" HTTP header as a fallback option for such browsers.
- DENY - No one can frame your site. This is the recommended setting
- SAMEORIGIN - The same as "self'for CSP. You can frame your own content, but no-one else can.
- ALLOW-FROM <uri> - Allow the specified URI to frame your content.</uri>
Don't Get Clickjacked
Clickjacking is a clever, misleading attack that can lead to reputational damage and revenue loss if your product can be manipulated by attackers. Check out our free learning resources to find out more about clickjacking.
Use a Content Security Policy and "X-Frame-Options" header to prevent others from using your site in malicious ways. Don't allow attackers to manipulate your users. Don't get clickjacked.
Click on the link below and download the PDF of this resource.
Secure Code Warrior is here for your organization to help you secure code across the entire software development lifecycle and create a culture in which cybersecurity is top of mind. Whether you’re an AppSec Manager, Developer, CISO, or anyone involved in security, we can help your organization reduce risks associated with insecure code.
View reportBook a demo
Jaap Karan Singh is a Secure Coding Evangelist, Chief Singh and co-founder of Secure Code Warrior.
Susie opens her email to escape from a nasty report that's due in two days. She sees a link for a free iPad appear in her inbox. After clicking it, she goes to a website with a large banner page reading, "Click here for your free iPad!". She clicks the button but nothing really seems to happen. The problem is, something did happen.
After navigating back to her inbox, she realizes all of her emails have been deleted. She didn't even hit "delete'on any of them. What's going on?
The email site was clickjacked. Clickjacking tricks users into performing actions they didn't intend to perform, and it can lead to serious problems.
Let's take a look now at how clickjacking works, why it's dangerous, and what developers like you can do to prevent it:
Understand Clickjacking
Clickjacking, also called a "UI redressing attack", occurs when an attacker uses several transparent layers on a web page to trick the user into clicking on a button or link the user doesn't intend to click on.
Have you ever had a bug stuck in your car? They fly up against the window furiously trying to fly outside. The bug's intention is to fly to what looks like trees and open air, oblivious of the glass blocking its path.
Clickjacking is similar in design, except the user is the bug and your website is the glass blocking the way. The user sees something they want, such as a free iPhone. The attacker places your site inside a transparent frame on top of the free iPhone ad. When the user clicks on the button to grab the allegedly "free'prize, they are actually clicking on a button on your site, performing an action they didn't intend.
Why Clickjacking is Dangerous
What can an attacker do with clickjacking? It largely depends on the functionality of the website in question.
The attacker could get a user to like or share the attacker's site on social media. This can be easily pulled off since many people stay logged into their social media accounts for convenience purposes.
If your site can be placed in a frame, a sensitive operation can be completed by clicking a button, and this can act as an attack vector. For example, a user clicks to get a free iPad but instead changes account settings on your site to make the account less secure. An attack of this type occurred against the Adobe Flash plugin settings page. The settings could be placed in a transparent frame, tricking the user into allowing any Flash animation access to the microphone and camera. Attackers could then record the victim; a major invasion of privacy.
An email client could be framed into a site, causing the user to delete all emails in their mailbox or forward emails to an email address controlled by the attacker.
The bottom line is: the user can't see what they're clicking, so they can be convinced to click anything. Whether it is a social share or downloading malware, the possibilities are vast.
How to Defeat Clickjacking
Clickjacking can be prevented. The recommended way to prevent clickjacking is to define a content security policy, or CSP, for your site. Using the "frame ancestors" HTTP response header, you can control how your site can be framed.
- "frame-ancestors none'- No other site is allowed to frame yours. This is the recommended setting.
- "frame-ancestors self'- Pages in your site can only be framed by other pages within your site.
- "frame-ancestors self <uri list=""> - Your site can be framed by the sites in the URI lists and no others.</uri>
CSP frame-ancestors is not currently supported by all major browsers. Use the "X-Frame-Options" HTTP header as a fallback option for such browsers.
- DENY - No one can frame your site. This is the recommended setting
- SAMEORIGIN - The same as "self'for CSP. You can frame your own content, but no-one else can.
- ALLOW-FROM <uri> - Allow the specified URI to frame your content.</uri>
Don't Get Clickjacked
Clickjacking is a clever, misleading attack that can lead to reputational damage and revenue loss if your product can be manipulated by attackers. Check out our free learning resources to find out more about clickjacking.
Use a Content Security Policy and "X-Frame-Options" header to prevent others from using your site in malicious ways. Don't allow attackers to manipulate your users. Don't get clickjacked.
Table of contents
Jaap Karan Singh is a Secure Coding Evangelist, Chief Singh and co-founder of Secure Code Warrior.
Secure Code Warrior is here for your organization to help you secure code across the entire software development lifecycle and create a culture in which cybersecurity is top of mind. Whether you’re an AppSec Manager, Developer, CISO, or anyone involved in security, we can help your organization reduce risks associated with insecure code.
Book a demoDownloadResources to get you started
Benchmarking Security Skills: Streamlining Secure-by-Design in the Enterprise
The Secure-by-Design movement is the future of secure software development. Learn about the key elements companies need to keep in mind when they think about a Secure-by-Design initiative.
DigitalOcean Decreases Security Debt with Secure Code Warrior
DigitalOcean's use of Secure Code Warrior training has significantly reduced security debt, allowing teams to focus more on innovation and productivity. The improved security has strengthened their product quality and competitive edge. Looking ahead, the SCW Trust Score will help them further enhance security practices and continue driving innovation.
Resources to get you started
Trust Score Reveals the Value of Secure-by-Design Upskilling Initiatives
Our research has shown that secure code training works. Trust Score, using an algorithm drawing on more than 20 million learning data points from work by more than 250,000 learners at over 600 organizations, reveals its effectiveness in driving down vulnerabilities and how to make the initiative even more effective.
.png)
Reactive Versus Preventive Security: Prevention Is a Better Cure
The idea of bringing preventive security to legacy code and systems at the same time as newer applications can seem daunting, but a Secure-by-Design approach, enforced by upskilling developers, can apply security best practices to those systems. It’s the best chance many organizations have of improving their security postures.
The Benefits of Benchmarking Security Skills for Developers
The growing focus on secure code and Secure-by-Design principles requires developers to be trained in cybersecurity from the start of the SDLC, with tools like Secure Code Warrior’s Trust Score helping measure and improve their progress.
Driving Meaningful Success for Enterprise Secure-by-Design Initiatives
Our latest research paper, Benchmarking Security Skills: Streamlining Secure-by-Design in the Enterprise is the result of deep analysis of real Secure-by-Design initiatives at the enterprise level, and deriving best practice approaches based on data-driven findings.
Developer-driven coding.
Securely.
Contact us today and make software security an intrinsic part of your development process.
