Accessible Rich Internet Applications [HSCTF 6 web]

https://ctftime.org/writeup/15644

前提知識

• 難読化ページへの対処（Chromeのデベロッパツールでなんとかする）
• ARIA

解説

ほぼこれの和訳記事です。

おしゃれなサイトが出てくる。
色々入力してみるがi love 0やらi love 1やら出てくる。
ソースを見てみると難読化されていて何もわからない。

Google Chromeで改めて開き、デベロッパーツールを使って見てみる。

色々あるが、見慣れぬ属性がある。
divタグにrole, aria-posinset, aria-setsize属性がついている。
ぐぐると、ARIAというらしい。
これが問題の題名にもなっているので、この辺が怪しい。
該当する属性は、aria-posinset, aria-setsizeは2つ合わせて使うもの。
aria-setsizeは集合のサイズで、aria-posinsetは集合の何番目かというもの。

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

とあれば、これは1040個のうち525番目が1であるということ。
で、これがたくさんあるので、順番に並べよう。
これだけだと01列なので、どういう変換をするか考えるが、
とりあえずアスキー文字として変換する。
これにはpythonとBeautiful Soupを使おう。

from bs4 import BeautifulSoup

def binaryList2asciiString(lst):
    sz = int(len(lst)/8)
    res = ''
    for i in range(0,sz):
        str = ''
        for j in range(i*8,i*8+8):
            str += lst[j]
        res += chr(int(str, 2))
    return res


with open('index2.html') as fp:
    soup = BeautifulSoup(fp,'html.parser')

buf = []
for i in range(0,1040):
    buf.append(soup.find('div',{'aria-posinset':str(i)}).contents[0])

ans = binaryList2asciiString(buf)

print(ans)

すると、答えが出てくる。

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}