This is a glorious story from a few years ago. If you haven't read about it before, I'm about to tell you. If you already know about this, I suggest you share it. I think it's both hilarious and is a really great in-the-wild demonstration of cross-site scripting vulnerabilities.
Firstly, the definition of cross-site scripting
Cross-site Scripting (XSS) refers to client-side code injection attack wherein an attacker can execute malicious scripts (also commonly referred to as a malicious payload) into a legitimate website or web application.
If this is not clear, why don't we jump right into the Tweetdeck example. It should clarify things.
<script class="xss">$('.xss').parents().eq(1).find('a').eq(1).click();$('[data-action=retweet]').click();alert('XSS in Tweetdeck')</script>♥
— *andy (@derGeruhn) June 11, 2014
Tweetdeck is a third-party Twitter platform, since acquired by Twitter for $40 million, that allows Twitter power users to consume a more customized Twitter feed. And at the time that this tweet was made, it also allowed browsers to execute the content of a tweet as code. ðŸ˜
Let's dive into the tweet's code.
<script class="xss">
This is the opening of a script tag with the class "xss". It's a plain old HTML node that will now be executed in the browser.
$('.xss')
This is a jQuery selector taking advantage of the fact that jQuery was already included in the Tweetdeck page to select the tag by the class of "xss". This attack could have been carried out without the presence of jQuery, but it made it that much easier.
.parents().eq(1)
This command selects a parent element of the script tag. Presumably this is the tweet's <div>.
.find('a').eq(1).click()
This command selects the second child of the selected parent that is an anchor tag and clicks it.
$('[data-action=retweet]').click()
This command selects an element with the data attribute of data-action=retweet and clicks it.
alert('XSS in Tweetdeck')
All the damage has already been done, but for good measure, an alert dialogue has been triggered.
</script>♥
And because 140 characters is way more than enough to execute this attack, the script has been closed and sealed with a heart. â¤ï¸
When this tweet's <div> was rendered in the Tweetdeck browser, the code would execute and the tweet itself would get retweeted. This would cause it to end up in more Tweetdeck clients and the worm would simply keep worming. This is what it means to go viral and demonstrates the power of a cross-site scripting attack. There are a lot of stories of computer viruses that spread in similar ways since the dawn of network computing.
Let's take another look at the tweet:
<script class="xss">$('.xss').parents().eq(1).find('a').eq(1).click();$('[data-action=retweet]').click();alert('XSS in Tweetdeck')</script>♥
— *andy (@derGeruhn) June 11, 2014
I don't know about you, but I don't have a lot of tweets that have achieved those kinds of retweet numbers.
Happy coding. </script>â¤ï¸
Top comments (14)
The heart is the most important part of this. The XSS attack wouldn't work without it. I think it had to do with the way TweetDeck escaped HTML.
literally a heart attack
You're right, the heart emoji was integral to the attack. If I recall correctly, a new escaping mechanism for how emoji were handled was deployed and caused the XSS vulnerability.
< script >alert('Hello XSS')</ script >
The hearth emoji caused the HTML filter to break.
How many angry emails do you think the tweet deck creators got that day? hmmmm
I think they got many upon many of them ^^
Awesome! 😂
I never knew about this, ha! Retweets were made for XSS ;)
Born for each other.
Love it. Great post!
Thanks!
Well, without jQuery it wouldn't have been so easy to fit it in a tweet. But yeah, this is pretty cool :>
you can still call and execute an external script...