|
|
|
|
@ -0,0 +1,178 @@
|
|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="en">
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="UTF-8">
|
|
|
|
|
<title>The "Quiz Your Friends" Cross-Site Scripting Vulnerability | tait.tech</title>
|
|
|
|
|
<link rel="stylesheet" href="/assets/css/style.css">
|
|
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<div id="wrapper">
|
|
|
|
|
<nav>
|
|
|
|
|
<input type="checkbox" id="menu">
|
|
|
|
|
<label for="menu">☰</label>
|
|
|
|
|
<div class="menu-content">
|
|
|
|
|
|
|
|
|
|
<a href="/" class="nav-link" >Home</a>
|
|
|
|
|
|
|
|
|
|
<a href="/blog/" class="nav-link" >Blog</a>
|
|
|
|
|
|
|
|
|
|
<a href="/links/" class="nav-link" >Links</a>
|
|
|
|
|
|
|
|
|
|
<a href="/ideas/" class="nav-link" >Ideas</a>
|
|
|
|
|
|
|
|
|
|
<a href="https://github.com/TTWNO/" class="nav-link" target="_blank" rel="noopener noreferrer" >Code</a>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</nav>
|
|
|
|
|
|
|
|
|
|
<h1>The "Quiz Your Friends" Cross-Site Scripting Vulnerability</h1>
|
|
|
|
|
<h4 class="post-date line-under">Wednesday, April 22 2020</h4>
|
|
|
|
|
|
|
|
|
|
<div class="article">
|
|
|
|
|
<p>This was fun to write! I found a cross-site scripting (XSS) attack
|
|
|
|
|
in a well-known quiz hosting website.
|
|
|
|
|
I disclosed the vulnerability to them years ago, so I thought
|
|
|
|
|
now might be a good time to write about it.</p>
|
|
|
|
|
|
|
|
|
|
<p>In this first section I will explain what XSS is.</p>
|
|
|
|
|
|
|
|
|
|
<p>In the <a href="#executing-an-exploit">second section</a> I will show you how I found this exploit and how to reproduce it yourself.</p>
|
|
|
|
|
|
|
|
|
|
<h2 id="what-is-cross-site-scripting-xss">What is cross-site scripting (XSS)</h2>
|
|
|
|
|
|
|
|
|
|
<p>Cross-site scripting, XSS for short,
|
|
|
|
|
is a technique to execute arbitrary Javascript code on a user visitng a website
|
|
|
|
|
by linking to Javascript code stored on another website.</p>
|
|
|
|
|
|
|
|
|
|
<p>So for example:</p>
|
|
|
|
|
|
|
|
|
|
<p>I have a file on my website called <a href="/assets/js/hacked.js">hacked.js</a>.
|
|
|
|
|
If I was able to run this javascript file on anybody visiting a certain website <em>that is not mine</em>, this would be called cross-site scripting.</p>
|
|
|
|
|
|
|
|
|
|
<p>Click the above <code class="highlighter-rouge">hacked.js</code> link to view the code I use to “hack” this website.
|
|
|
|
|
It’s safe, I promise ;)</p>
|
|
|
|
|
|
|
|
|
|
<p>Now, how can we get this code to execute when a user visits this site?</p>
|
|
|
|
|
|
|
|
|
|
<h3 id="how-do-these-happen">How Do These Happen?</h3>
|
|
|
|
|
|
|
|
|
|
<p>Most of the time, these attacks are done using poorly sanatized <code class="highlighter-rouge"><input></code> elements.
|
|
|
|
|
Sanitization is when an input box of some type does not <a href="">escape</a> html characters like <code class="highlighter-rouge"><</code> or <code class="highlighter-rouge">></code>.</p>
|
|
|
|
|
|
|
|
|
|
<p>Sanitization is when a program (usually on the server side),
|
|
|
|
|
will remove characters like <code class="highlighter-rouge"><</code> and replace them with <a href="">escape characters</a>
|
|
|
|
|
which internally would be something like <code class="highlighter-rouge">&lt;</code>,
|
|
|
|
|
but your browser would interpret that as “show me the character ‘less than sign’”.</p>
|
|
|
|
|
|
|
|
|
|
<h3 id="a-thought-experiment">A Thought Experiment</h3>
|
|
|
|
|
|
|
|
|
|
<p>The question is:</p>
|
|
|
|
|
|
|
|
|
|
<p>If we suppose that a website is built with sequenses like these: <code class="highlighter-rouge"><body></code>, <code class="highlighter-rouge"><p></code> (for paragraph), <code class="highlighter-rouge"><link></code> and <code class="highlighter-rouge"><b></code> for bold, then why can you also <em>see</em> the left and right angle bracket characters?
|
|
|
|
|
Why doesn’t everything after me typing <code class="highlighter-rouge"><b></code> turn bold?</p>
|
|
|
|
|
|
|
|
|
|
<p>The answer is:</p>
|
|
|
|
|
|
|
|
|
|
<p>There are special characters to type a visible left (<)
|
|
|
|
|
and right angle bracket (>) in a website.
|
|
|
|
|
If I type with the left and right bracket on my keyboard,
|
|
|
|
|
things will indeed <b>show up bold</b>.</p>
|
|
|
|
|
|
|
|
|
|
<p>This is the code for the sentence I wrote above:</p>
|
|
|
|
|
<pre class="terminal">
|
|
|
|
|
There are special characters to type a visible left (&lt;)
|
|
|
|
|
and right angle bracket (&gt;) in a website.
|
|
|
|
|
If I type with the left and right bracket on my keyboard,
|
|
|
|
|
things will indeed <b>show up bold</b>.
|
|
|
|
|
</pre>
|
|
|
|
|
|
|
|
|
|
<p>Notice how all visible left angle brackets used an <code class="highlighter-rouge">&lt;</code> to show them?</p>
|
|
|
|
|
|
|
|
|
|
<p>This is the core of an XSS exploit.</p>
|
|
|
|
|
|
|
|
|
|
<p>If when a site takes in input it does not convert all <s and >s to &lt; and &gt;,
|
|
|
|
|
then when this data is returned to the user the browser will interpret the user input being displayed <em>as HTML code</em>.</p>
|
|
|
|
|
|
|
|
|
|
<h2 id="how-i-found-this-exploit">How I Found This Exploit</h2>
|
|
|
|
|
|
|
|
|
|
<p>While filling in one of my friend’s surveys I thought it would be
|
|
|
|
|
funny for them to know it is me without anyone else knowing.
|
|
|
|
|
We were young and had <code class="highlighter-rouge">Inspect Element</code>ed a few things together,
|
|
|
|
|
so it was a safe bet that an HTML joke would let them know.</p>
|
|
|
|
|
|
|
|
|
|
<p>So I typed in my name like so:</p>
|
|
|
|
|
|
|
|
|
|
<p><code class="highlighter-rouge">BOLD_STEVE.JPG</code></p>
|
|
|
|
|
|
|
|
|
|
<p>Now in theory this should have shown in in the leaderboard as: “<b>Bold Steve</b>”
|
|
|
|
|
However, to my horror and excitement, I saw this in the leaderboard:</p>
|
|
|
|
|
|
|
|
|
|
<p><code class="highlighter-rouge">BOLD_STEVE_LEADERBOARD.JPG</code></p>
|
|
|
|
|
|
|
|
|
|
<p>The text “Bold Steve” showed up <strong>in bold</strong> on the leaderboard.
|
|
|
|
|
This told me all I needed to know. To add a <code class="highlighter-rouge"><script></code> tag was next.</p>
|
|
|
|
|
|
|
|
|
|
<h4 id="hacking">Hacking:</h4>
|
|
|
|
|
|
|
|
|
|
<p>So I went on my merry way thinking about ways to use malicious javascript.
|
|
|
|
|
Then, I thought that might be mean, so I decided to warn users instead.
|
|
|
|
|
I filled in the name with a script tag and a call to <code class="highlighter-rouge">alert()</code> to warn the user about this site.</p>
|
|
|
|
|
|
|
|
|
|
<p><code class="highlighter-rouge">JAVASCRIPT_NAME.JPG</code></p>
|
|
|
|
|
|
|
|
|
|
<p>I ran out of room before I could finish it. Hmmm.
|
|
|
|
|
What if I do “Inspect Element” and manually override the max-length attribute?</p>
|
|
|
|
|
|
|
|
|
|
<p>The unfortunate truth is: this worked as well!</p>
|
|
|
|
|
|
|
|
|
|
<p>Not only could I manually set the max-length by changing it in the HTML,
|
|
|
|
|
but there were no client-side OR server-side checks to make sure the name I was sending was less than or equal to 20 characters.</p>
|
|
|
|
|
|
|
|
|
|
<p>If Javascript checked it, it would have stopped me (although maybe not a professional).
|
|
|
|
|
If the server checked it, it could have stopped almost anyone.</p>
|
|
|
|
|
|
|
|
|
|
<h5 id="server-side-validation">Server-Side Validation</h5>
|
|
|
|
|
|
|
|
|
|
<p>As a side note, here is a great reason why you should do most of your validation on the server side.
|
|
|
|
|
As a user, I can edit any of the HTML, CSS, or Javascript your server serves to me.</p>
|
|
|
|
|
|
|
|
|
|
<p>Imagine trying to fit in a script tag doing anything useful with 20 characters?</p>
|
|
|
|
|
|
|
|
|
|
<p><code class="highlighter-rouge"><script src="http:"></code></p>
|
|
|
|
|
|
|
|
|
|
<p>There’s your 20 characters! No more! Good luck trying to do anything useful with this!</p>
|
|
|
|
|
|
|
|
|
|
<p>The Quiz My Friends server has <em>no such checks in place</em>.
|
|
|
|
|
Therefore, I can send an almost arbitrary load to them.
|
|
|
|
|
Being able to send something potentially very large (more than a few megabytes) is a vulnerability of its own.
|
|
|
|
|
Imagine being able to send entire executable progrmas as your “name” in one of these quizes?</p>
|
|
|
|
|
|
|
|
|
|
<h2 id="executing-an-exploit">Executing An Exploit</h2>
|
|
|
|
|
|
|
|
|
|
<p>Suppose we’re on a vulnerable site like <a href="https://www.quizyourfriends.com/">Quiz Your Friends</a>
|
|
|
|
|
and you decide you want to hack your friend’s quiz!
|
|
|
|
|
How can this be done?</p>
|
|
|
|
|
|
|
|
|
|
<h4 id="creating-a-quiz">Creating A Quiz</h4>
|
|
|
|
|
|
|
|
|
|
<p>Here is my quiz below:</p>
|
|
|
|
|
|
|
|
|
|
<p><code class="highlighter-rouge">CREATING_QUIZ.IMG</code></p>
|
|
|
|
|
|
|
|
|
|
<h4 id="setting-a-name-with-an-html-tag">Setting A Name With an HTML Tag</h4>
|
|
|
|
|
|
|
|
|
|
<p>Just like the image above, about how I found out about this vulnerability: go ahead and use an HTML tag in your name to test this out.</p>
|
|
|
|
|
|
|
|
|
|
<p><code class="highlighter-rouge">BOLD_ITALIC_STEVE.JPG</code></p>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<footer>
|
|
|
|
|
This page is mirrored on <a href="https://beta.tait.tech/2020/04/22/quiz-your-friends.html">beta.tait.tech</a>; it is not hosted by Linode.
|
|
|
|
|
</footer>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
Tait Hoyem
4 years ago