How Hackers Trick You Into Actions You Never Meant to Do !

Hey there! Ever heard of clickjacking? It’s this sneaky trick where hackers make you click on something, but you end up doing something totally different — like changing your email or deleting your account. Sounds wild, right? Let’s break it down and see how it all works, with some real-life style examples that’ll make it all click for you.

Clickjacking

Alright, so clickjacking is when someone tricks you into clicking something that does something totally different from what you think. Imagine you’re about to click a button to play a video, but instead, you’re actually clicking a hidden button that changes your email address. Crazy, right? That’s clickjacking in action.

Hackers usually use iframes — those invisible frames that let one website be loaded inside another — to pull off this trick. They make these frames invisible, so you don’t even see them!

Let’s look at a simple example. Imagine you’re on your favorite social media site, and you think you’re clicking a button to watch a cool video. But behind the scenes, you’re actually changing your email to one that the hacker controls.

The attacker sets up a webpage with an invisible form that’s already filled out with their email address.They put this form on top of the “Play Video” button you’re about to click.When you click the button, you’re actually submitting the form that changes your email!

Here’s a sneak peek at how that might look:

<!-- The attacker's page -->
<iframe id="emailChange" style="opacity: 0; position: absolute;" src="<https://your-social-media.com/email-settings?email=attacke@gmail.com>"></iframe>
<button>Click to Watch Video</button>
<script>
document.querySelector('button').addEventListener('click', function() {
document.getElementById('emailChange').contentWindow.document.forms[0].submit();
});
</script>

Sometimes, hackers don’t stop at just one click. They set up a multi-click trap to get you to do several things without you even realizing it. For example, deleting your account might take two clicks: one to delete and another to confirm.

The attacker makes a fun quiz or game that you want to play.The first click makes the “Delete Account” action happen.The second click confirms the deletion.

You’re clicking through the quiz, but each click is actually taking you closer to losing your account!

Here’s how that might look in code:

<!-- Hidden deletion forms -->
<iframe id="deleteAccount" style="opacity: 0; position: absolute;" src="<https://your-website.com/delete-account>"></iframe>
<iframe id="confirmDelete" style="opacity: 0; position: absolute;" src="<https://your-website.com/confirm-delete>"></iframe>
<!-- Fun buttons -->
<button id="step1">Take Quiz</button>
<button id="step2">Next Step</button>
<script>
document.getElementById('step1').addEventListener('click', function() {
document.getElementById('deleteAccount').contentWindow.document.forms[0].submit();
});
document.getElementById('step2').addEventListener('click', function() {
document.getElementById('confirmDelete').contentWindow.document.forms[0].submit();
});
</script>

Frame Busting Scripts:

Now, you might be wondering, “How do websites stop these tricks?” One way is using frame busting scripts. These scripts check if a website is being loaded inside an iframe and then break out of it if it is.

How Frame Busting Works:

Here’s a simple script that tries to prevent clickjacking:

if (window.top !== window.self) {
window.top.location = window.self.location;
}window.top is the top-level frame (your main website).window.self is the current frame.If the current frame isn’t the top frame, the script forces the page to load in the top frame, breaking out of the attack.

Why It’s Not Perfect:

But here’s the thing: attackers can use the HTML5 sandbox attribute to stop these scripts from working. It basically makes sure that the iframe can’t interact with the top frame, so frame busting scripts can’t do their thing:

<iframe src="<https://your-website.com>" sandbox="allow-forms"></iframe>

So, how do we avoid getting tricked? Here are some solid ways to protect your website.

1. HTTP Headers:

The Heavy Hitters

The best way to prevent clickjacking is using HTTP headers that tell the browser not to let your website be framed.

Two key ones are:

X-Frame-Options: This tells the browser whether your page can be framed.DENY: No framing at all.SAMEORIGIN: Only allow framing if it’s from the same website.X-Frame-Options: DENYContent-Security-Policy (CSP): This one’s more advanced and lets you specify who can frame your page with the frame-ancestors directive.Content-Security-Policy: frame-ancestors 'self'

2. Browser-Side Protections

Modern browsers have built-in defenses against clickjacking.And if you want extra protection, you can use extensions like NoScript that block dangerous scripts and frames.

3. Developer-Side Fixes

Frame Busting Scripts: Use them as an extra measure, but don’t rely on them alone.Set Headers: Always use X-Frame-Options and CSP headers to make sure your site is safe.

Clickjacking might seem like a small issue, but it can lead to big problems like losing control of your account or exposing your personal info. By understanding these attacks and using the right protections, we can keep our digital lives secure and avoid falling into these sneaky traps.