-
Notifications
You must be signed in to change notification settings - Fork 0
/
captcha.js
87 lines (69 loc) · 2.15 KB
/
captcha.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
const letters = "ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890";
const hexColor = "0123456789abcdef";
let captcha = "";
// let hashed = "";
let canvas = document.createElement("canvas");
let context = canvas.getContext("2d");
function generateStringForCaptcha(length = 6) {
let index = null;
let captchaString = "";
for (let i = 0; i < length; i++) {
index = Math.floor(Math.random() * (letters.length - 1));
captchaString += letters.charAt(index);
}
return captchaString;
}
function colorGenerator() {
let index = null;
let color = "#";
for (let i = 0; i < 6; i++) {
index = Math.floor(Math.random() * (hexColor.length - 1));
color += hexColor.charAt(index);
}
return color;
}
function lineNoiseGenerator(length = 25) {
for (let i = 0; i < length; i++) {
context.beginPath();
context.moveTo(canvas.width * Math.random(), canvas.height * Math.random());
context.lineTo(canvas.width * Math.random(), canvas.height * Math.random());
context.strokeStyle = colorGenerator();
context.lineWidth = 2;
context.stroke();
}
}
function dotNoiseGenerator(length = 150) {
for (let i = 0; i < length; i++) {
context.fillStyle = colorGenerator();
context.fillRect(canvas.width * Math.random(), canvas.height * Math.random(), 5, 5)
}
}
function draw() {
canvas.style.border = '1px solid black';
canvas.style.width = '150px';
canvas.style.backgroundColor = colorGenerator();
context.font = "italic 75px Arial";
context.fillStyle = colorGenerator();
captcha = generateStringForCaptcha()
// hashed = sha1(captcha.toLocaleLowerCase())
context.fillText(captcha, 0, 100);
// captcha = ""; // unset for safety
lineNoiseGenerator();
dotNoiseGenerator();
convertCanvasToImage();
}
function convertCanvasToImage() {
let image = document.getElementById("captchaImage");
image.src = canvas.toDataURL();
}
function validateCaptcha() {
let text = document.getElementById('captchaText').value;
return text.toLocaleLowerCase() === captcha.toLocaleLowerCase();
// return sha1(text.toLocaleLowerCase()) === hashed;
}
function regenerateCaptcha() {
document.getElementById('captchaText').value = "";
context.clearRect(0, 0, canvas.width, canvas.height);
draw();
}
draw();