captcha/resources/index.html

70 lines
1.5 KiB
HTML
Raw Normal View History

2023-07-14 02:50:21 +00:00
<!DOCTYPE html>
<html lang="en">
<head>
<title>tricaptcha</title>
<style>
body, input {
font-size: 18px;
font-family: sans-serif;
}
body {
margin: auto;
max-width: 900px;
padding-top: 40px;
}
img {
max-width: 100%;
}
input {
font-size: 16px;
}
#digits {
font-family: monospace;
width: 18ch;
}
</style>
</head>
<body>
<header><h1>tricaptcha</h1></header>
<main>
<p>
To ensure that you are a human, please view this image or listen
to this sound and enter the digits in the box below. Once you are done,
click "Submit".
</p>
<div style="padding-bottom: 5px;">
<img src="./image/{{id}}" alt="CAPTCHA image containing digits">
</div>
<div style="padding-bottom: 5px;">
<audio controls preload="none">
<source src="./audio/{{id}}" type="audio/wav">
CAPTCHA audio containing digits
</audio>
</div>
<form action="./submit" method="post">
<input type="hidden" name="id" value="{{id}}">
<label for="digits">Digits: </label>
<input type="text" name="digits" id="digits" value="">
<input type="submit" value="Submit">
</form>
</main>
</body>
</html>
<!--
View the PNG image at ./image/{{id}} or listen
to the WAV audio file at ./image/{{id}} and
determine which digits they contain. The image
and audio can only be requested once each.
Make a POST request to ./submit with the
body
id={{id}}&digits=DIGITS
where DIGITS is replaced with the sequence of
digits that you heard or saw.
-->