PCM_CCTF_challenge/encode_flag/index.html

57 lines
2.1 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title>CCTF flag encoder</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
</head>
<body>
<div style="padding: 20px">
<h1>CCTF flag encoder</h1>
<details>
<summary>Instructions</summary>
<ul>
<li>Enter your flag to the box, and press encode!</li>
<li>Your encoded flag will appear below.</li>
<li>Copy the encoded flag into your contract call.</li>
</ul>
</details>
<br />
<div class="form">
<div class="form-group">
<input class="flag" placeholder="enter the flag" /><-- Your flag
</div>
<div class="form-group">
<input class="address" placeholder="enter the address" /><-- Your address
</div>
<div class="form-group">
<button class="encode">Encode Flag</button>
</div>
<div class="form-group">
<input class="encoded" disabled="true" placeholder="" /><-- Your encoded result
</div>
</div>
</div>
</body>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.min.js" integrity="sha384-cuYeSxntonz0PPNlHhBs68uyIAVpIIOZZ5JqeqvYYIcEL727kskC66kF92t6Xl2V" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/web3@latest/dist/web3.min.js"></script>
<script>
const web3 = new Web3(new Web3.providers.HttpProvider('http://127.0.0.1:8545'));
console.log(web3);
const encodeButton = document.querySelector('button.encode');
encodeButton.addEventListener('click', encodeMessage);
async function encodeMessage() {
try {
const flag = document.querySelector('.flag').value;
const address = document.querySelector('.address').value;
const signedMsg = web3.eth.accounts.sign(address, flag);
document.querySelector('.encoded').value = signedMsg.signature;
} catch (err) {
console.error(err);
alert('Problem happened: ' + err.message || err);
}
}
</script>
</html>