HSCTF 6 [ ARIA ]

CTF Writeups
, , ,

banner

HSCTF was a medium level 5 day long CTF.
New Challenges were being released every day, so basically it was fun.

Our Team Dc1ph3R finished 19th globally.

I will be discussing a web challenge today which is more likely to be a scripting challenge according to me.

Download index.html

After opening the index.html in our browser we see a Label “Magic Number Generator” along with an input field..

So I tried to tinker around with the web app.
I entered some text randomly and it redirected me to a google search with “I like 1”.

I tried once more and again got the same search text…

Viewing the source gave some gibberish text within the script tags.

But after opening the Dev Console on the Browser gave some meaningful Javascript and HTML code. 

1
<div role="option" aria-posinset="291" aria-setsize="1040">0</div>

There is a DIV with an ID list and which is using ARIA (Accessible Rich Internet Applications).
More info about ARIA here.

So the JS Code basically selects a random child from the DIV and gets the binary digit.
It checks whether the key pressed is “ENTER” and then carries a Google search by concatenating the binary digit to the string “I like “.
So Technically there is no use of our input.. XD 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
 window.onload = () => 
    document.getElementById("search-box").onkeypress = (e) =>
    {
        if(e.keyCode === 13)
        {
          window.location = "https://www.google.com/search?q=i+like+" +  
          document.getElementById("list").children[Math.floor(Math.random() *  
          document.getElementById("list").children.length)].innerText;
        }
    } 
```  

It came me that these binary digits can give out an ascii text after joining them.
But the order of arrangement was not right...  
After looking into another property of the div items defined in the source, I observed that the [aria-posinset](https://www.maxability.co.in/2015/09/27/aria-posinset-property/) property is used to give an element’s number or position in the current set of listitems or treeitems.  

Next I fired up Sublime to bake some Python and make use of my favourite library **BeautifulSoup**.  
As the original index.html contained obfuscated code, I copied the code from the Dev Console and created a new html file named aria.html.   
At first, we may want to know the number of digits and see if their total is divisible by 8 so as to confirm that it is a perfect binary to text conversion case.  

```py
from bs4 import BeautifulSoup

with open("aria.html") as fp:
    soup = BeautifulSoup(fp,"html.parser")

binDig = []

for item in soup.find_all('div', {'role':"option"}):
    binDig.append(int(item['aria-posinset']))

print(len(binDig))

After running the above script, the total no. of items came out to be 1040 which is perfectly divisible by 8.

1040/8 = 130

It confirms that we’ll get 130 chars after scraping the binary digits.

Now we sort them according to their corresponding aria-posinset property and convert all the scraped binaries into ascii with the following python script. 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
from bs4 import BeautifulSoup

def binary2ascii(s):
    return ''.join(chr(int(s[i*8:i*8+8],2)) for i in range(len(s)//8))

with open("aria.html") as fp:
    soup = BeautifulSoup(fp,"html.parser")

a=0
flag=[]

for i in range(0,1040):
    flag.append(soup.find('div',{'aria-posinset':str(i)}).contents[0])
    a+=1
    if a%8==0:
        print(binary2ascii("".join(flag)),end='')
        flag.clear()

And finally we are presented with the some text along with our flag.

im gonna add some filler text here so the page is a bit longer. lorem ipsum… here’s the flag btw, flag{accessibility_is_crucial}

Coming up are some writeups from BCA CTF.

So Make sure to subscribe to the newsletter to learn together with me.
Also Comment your feedbacks and share this writeup with your friends.