Google recaptcha V3

В белой комнате на белом столе стоит аэрозоль против ботов

Вот молодец гуголь, вообще там знают как деньги зарабатывать, когда для яндексовой капчи нужно привязать карту и закинуть на неё денег, гугловая, просто в два клика создается. Казалось бы сделай так, чтобы у всех стояла твоя капча и за постгрей к тебе потом пойдут, но нет, надо здесь и сейчас со дна фонтана содрать копеечку...

Хватит ныть, за дело!

Идем в гугл за рекапчей, сложно представить что может быть проще, ну красавцы, у всех на сайтах бейдж гугла! Нужно указать свой хост. Для моего блога он будет treecode.ru. Нам выдали два ключа, один SITE KEY, второй SECRET KEY. Первый нужен, чтобы в джабаскрипте его указать, второй мы будем использовать для проверки: бот запрос сделал или люд.

В целом, схема такая: на странице с формой в срипте используем ключ, перед отправкой формы используя sdk recaptcha мы получаем токен, его подсовываем в свою форму и отправляем запрос на бэк. Теперь на бэке шлем запрос в гуголь с нашим серкетом и токеном, и получаем score (тип float), который сами интерпретируем. Например, если меньше 0.5, значит бот, отбиваем запрос с ошибкой.

Наверняка есть библиотека composer для работы с рекапчей. Но тут ради пары-тройки строчек кода тянуть зависимость, на мой взгляд, как говорил Алексей - ну такое.

Беззащитная форма

Ну тоже npm пакет наверняка есть, но мы тут накидаем немного ручками. Заюзаем метод ready от recaptcha sdk объекта grecaptcha, в нём навешаем слушателя на отправку формы, так же мы предотвратим отправку по кнопке, отправим, после получения токена.

Форма из примера имеет id="my-poor-form", скрытое поле с name="token", ну и все другие поля. В header, мы подключили скрипт формы src="https://www.google.com/recaptcha/api.js?render=SITE KEY"

const form = document.getElementById('my-poor-form');grecaptcha.ready(function() {	form.addEventListener('submit', function(event) {		event.preventDefault();		grecaptcha.execute('SITE KEY', {action: 'submit'}).then(function(token) {		form.querySelector('input[name="token"]').value = token;		form.submit();	});});

Фронтовая часть закночена. На этом шаге форма должна отправляться, с новым полем token, в которое вставляются данные от гугла.

Всемогущий бэк

Собираем url запрос из полученного токена $clientToken и серкетного ключа и делаем GET запрос в гугл, для получения score клиентского запроса. Есть ощущение, что можно отбивать score ниже 0.7

$url = sprintf('https://www.google.com/recaptcha/api/siteverify?secret=%s&response=%s', 'SECRET KEY', $clientToken);$response = file_get_contents($url);$parsed = json_decode($response, true);if (empty($parsed['success']) || $parsed['score'] <= 0.5) {	throw new \DomainException('You are bot');}

Это ознакомительный пример, но полностью рабочий.