<html>
<head>
<script src="jquery-3.3.1.min.js"></script>
<script>
var bytes = [];
$.get("bytes", function(resp) {
bytes = Array.from(resp.split(" "), x => Number(x));
});
function assemble_png(u_in){
var LEN = 16;
var key = "00000000000000000000000000000000";
var shifter;
if(u_in.length == key.length){
key = u_in;
}
var result = [];
for(var i = 0; i < LEN; i++){
shifter = Number(key.slice((i*2),(i*2)+1));
for(var j = 0; j < (bytes.length / LEN); j ++){
result[(j * LEN) + i] = bytes[(((j + shifter) * LEN) % bytes.length) + i]
}
}
while(result[result.length-1] == 0){
result = result.slice(0,result.length-1);
}
document.getElementById("Area").src = "data:image/png;base64," + btoa(String.fromCharCode.apply(null, new Uint8Array(result)));
return false;
}
</script>
</head>
<body>
<center>
<form action="#" onsubmit="assemble_png(document.getElementById('user_in').value)">
<input type="text" id="user_in">
<input type="submit" value="Submit">
</form>
<img id="Area" src=""/>
</center>
</body>
</html>
Run $.get("bytes", function(resp) {bytes = Array.from(resp.split(" "), x => Number(x));}); from the source code in developer console to get list of bytes:
This website is similar to the first "Java Script Kiddie" except for this line: shifter = Number(key.slice((i*2),(i*2)+1));. This effectively ignores every second value in the key. Since var LEN = 16 is the same, the script for the previous challenge can be used again but with a random value (I chose 0) added between character.
Run script.py. For each character of the key, this script will try all digits until one is found that places the expected value in the current location. It also adds padding (0) after each digit found.
Output:
Key:50706000107050006010009030000030KeyLength:32
Use zbar (sudo apt install zbar-tools): zbarimg index.png and get the flag: