Web Security

Challenge 6: Solution

Web Security

Check out a free preview of the full Web Security course

The "Challenge 6: Solution" Lesson is part of the full, Web Security course featured in this preview video. Here's what you'd learn in this lesson:

Mike walks through the solution to Challenge 6. JSBIN


Transcript from the "Challenge 6: Solution" Lesson

>> Mike North: Welcome back, we're going to look at how one might stage a clickjacking attack. So I've got a pre-prepared URL, I'm gonna open up in a browser here.
>> Mike North: Another JS Bin.
>> Mike North: So, what I want you to see is, we've got a tantalizing landing page here in browser default styling, as I like my landing pages, just because they load so fast.

And, you can see who's got an iframe down here. I'm gonna actually dial back the opacity here. I wanna make sure I'm logged in.
>> Mike North: I think I might be suspended right now.
>> Mike North: There we go.
>> Mike North: Wonderful, so you can see, the easiest way to get clickjacking to build one of these is to operate at 50% opacity and to sort of position things until you're happy with them.

So this is an exercise of some expert CSS nudging here. So we're just gonna find the iframe,
>> Mike North: And, where are you?
>> Mike North: There we are. So we can grab that iFrame, and we then want to manipulate the styles a little bit.
>> Mike North: Sorry, let me back off.

All right, so we've got some styles, we've selected our iframe, we still have it, great.
>> Mike North: So here we can say, like the position is absolute. So let's say we go left of 400 pixels.
>> Mike North: Maybe I landed exactly at where it happened to be, I did. All right, so 300, that's too much, 200.

All right, let's work on getting that up a little bit, top.
>> Mike North: So -200 pixels, it looks like a little bit too much. Pro tip, if you hold option and shift up and down, you can like jump by 10 pixel increments, that looks okay, right. It's nice that we have the button that users clicking on is smaller than the one they think they're clicking on is a smaller target.

We can just put it completely inside the other one. So there, let me make sure I'm just gonna drag this. Good, that's absolute positioning is what you want there. And, let me make sure my copy that and I put it into the style property using inline CSS as all great CSS practitioners do.

>> Mike North: Okay, so there it is. And if we run it again, it's still there. Looks like we're at the log in page again, silly thing.
>> Mike North: Should have never used the database for sessions.
>> Mike North: All right, and the last thing we would do here is basically fade this out.

>> Mike North: And now when we click this, I'll notice first off like it should alarm you that, you see my cursor's changing as I get anywhere near this button? That's bad news. And you click this, and it's like, nothing happened. What do you do when you click a button and nothing happens?

You click more, and click more, and click more, and now everybody's gone. So that is how you stage a clickjacking attack.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now