капча на php + html
Хочу сделать переделать весь сайт arzkapcha.ru на свой хост + домен т.к. в Украине больше не работают сайты .ru :( Вот мой сайт arzkapcha.ml - я не понимаю как сделать такую же генерацию капчи kapcha.php. Пов файлы : https://dropmefiles.com.ua/ru/vQ9ks247DM
Ответы (1 шт):
Автор решения: Проста Miha
→ Ссылка
Вот мой вариант на чистом JS)
const kapcha = document.querySelector('.overlay');
const result = document.querySelector('.result');
var milisec = 0,
sec = 0,
min = 0;
document.addEventListener('keypress', function(e) {
if (e.key == 'n' || e.key == 'N') start();
if (e.key == 'Enter') check();
})
function start() {
let kapchaBlock = document.querySelector('.kapcha-block');
if (kapchaBlock != null) return;
milisec = 0;
sec = 0;
min = 0;
myTimer = setInterval(timer, 10);
removeAll();
let createDiv = document.createElement('div');
createDiv.className = 'kapcha-block';
let createText = document.createElement('h1');
createText.className = 'kapcha-text';
createText.innerHTML = randomKapchaNumber();
let createInput = document.createElement('input');
createInput.setAttribute('type', 'number');
createInput.className = 'kapcha-input';
createInput.autofocus = true;
createDiv.append(createText, createInput);
kapcha.appendChild(createDiv);
}
function check() {
let input = document.querySelector('.kapcha-input');
if (input == null) return;
clearTimeout(myTimer);
let text = document.querySelector('.kapcha-text');
let res = 0,
inputText, correctText = text.innerHTML;
inputText = input.value == '' ? 0 : input.value;
let createDiv = document.createElement('div');
if (inputText == correctText) {
res = 'Капча пройдена';
} else {
res = 'Капча не пройдена';
}
removeAll();
createDiv.className = 'result-block';
min = min < 10 ? '0' + min : min;
sec = sec < 10 ? '0' + sec : sec;
createDiv.innerHTML = res + ' ' + inputText + '/' + correctText + ' ' + min + ':' + sec + ':' + milisec;
result.append(createDiv);
}
function timer() {
milisec++;
if (milisec == 99) {
sec++;
milisec = 0;
}
if (sec == 59) {
min++;
sec = 0;
}
}
function removeAll() {
kapcha.innerHTML = '';
}
function randomKapchaNumber(min = 10000, max = 99999) {
return Math.floor(Math.random() * (max - min) + min);
}
body {
margin: 0;
width: 100%;
min-height: 100vh;
}
.overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
min-height: 100vh;
display: flex;
justify-content: center;
align-items: center;
z-index: 0;
}
.kapcha-block {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.kapcha-text {
z-index: 999;
}
.kapcha-block:after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, .4);
z-index: -1;
}
.kapcha-text {
text-align: center;
font-family: consolas;
font-size: 64px;
margin: 0;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
}
.result {
position: relative;
z-index: 99;
}
<div class="kapcha">
<div class="result"></div>
<div class="overlay"></div>
</div>