В этой статье рассмотрим установку и настройку новой версии reCaptcha API от Google в которой обновлен дизайн и внедрены новые механизмы проверки. Этот инструмент поможет защитить формы вашего сайта от спама и роботов.
Для начала работы с reCAPTCHA API нам необходимо получить ключ от Google и создать приложение для работы. Переходим по ссылке для получения ключа. Вам необходимо иметь учетную запись в службах Google.
Установка reCaptcha 2, получение ключей, регистрация сайта
После добавления сайта вам будет выдано два ключа Публичный ключ – нужен для отображения блока reCAPTCHA на странице с формой. Секретный ключ – нужен для соединения с серверами Google и проверке правильности отправки reCAPTCHA. Секретный ключ должен хранится только на сервере и не должен быть доступен пользователям. Далее проделываем операции как указано в инструкции. Размещаем код библиотеку reCAPTCHA 2.0 на нужной нам странице перед закрывающим тегом head в HTML-коде:А сам div блок вставляем в конце объекта form в том месте, где вы хотите видеть блок reCAPTCHA:
Теперь переходим на нашу страницу, если код библиотеки и блок вызова reCAPTCHA с ключом установлены верно, то мы увидим нашу форму и блок проверки для роботов. reCaptcha отображается на странице, но пока не выполняет никаких функций защиты от спама, форму можно просто отправить не ставя галочку в чекбоксе reCAPTCHA. Для проверки формы нам необходимо выполнить настройку на стороне сервера в скрипте формы.
Интеграция reCAPTCHA 2.0 на стороне сервера
Первым делом давайте посмотрим что нам отвечет сервер при установке галочки "Я не робот". Для этого в любом месте страницы устанавливем код:print_r($_POST);Обновляем страницу и отправляем форму не проходя проверку:
Array ( [username] => [password] => [password_verification] => [email] => [g-recaptcha-response] => [submit] => Подтвердить регистрацию )А теперь обновляем страницу установив галочку "Я не робот"
Array ( [username] => [password] => [password_verification] => [email] => [g-recaptcha-response] => 03AHJ_VuuiQ3gaUy_33kGW2m3PS3-pshWvaYwKgCywDSDu27XdiL-cPsr3c0xD1MeEOi65bSd9B_7Qxxy4kcT6zrkgbhSpSILoNasPOxnYplj_NOfApZGd3P9xWtB-N31H30sncxBAiaXwubCQQLkwJTUW43rFVvTv65PvjLgqj_04aSXVlLDTgM6Hwz0RWeCXmRQXVxvhJbQJOw_mx0HdMqzBsPUbEDCqmAONIw1zQhPgTckU1r9NbDd_ioyU5M2xAJuiLH8ZhAhQIQi6B5bucPvAesskzeymSa1vtHxwBwR961ne-xGn9CwwUEt_kZh3HGfRe70uApaY_hvPos [submit] => Подтвердить регистрацию )
Как видно из кода выше, элемент массива g-recaptcha-response имеет значение, а это значит что сервер проверки ответил нам на запрос и проверка пройдена удачно.
Далее нам необходимо отправить POST запрос на сервер Google reCAPTCHA по адресу google.com/recaptcha/api/siteverify и передамть ему переменные:
- secret — секретный ключ полученный при регистрации сайта
- response — код полученный при установке галочки "Я не робот" из элемента массива [g-recaptcha-response]
- remoteip – IP адрес пользователя, который заполняет форму и проходит проверку
Готовим функцию подключения к серверу. В PHP должно быть активировано расширение CURL.
function SiteVerify($url) { $curl = curl_init(); curl_setopt($curl, CURLOPT_URL, $url); curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1); curl_setopt($curl, CURLOPT_TIMEOUT, 15); curl_setopt($curl, CURLOPT_USERAGENT, "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.87 Safari/537.36"); $curlData = curl_exec($curl); curl_close($curl); return $curlData; }
if($_SERVER["REQUEST_METHOD"] == "POST") { $recaptcha=$_POST['g-recaptcha-response']; if(!empty($recaptcha)) { $google_url="https://www.google.com/recaptcha/api/siteverify"; $secret='Секретный ключ для серверной стороны'; $ip=$_SERVER['REMOTE_ADDR']; $url=$google_url."?secret=".$secret."&response=".$recaptcha."&remoteip=".$ip; $res=SiteVerify($url); $res= json_decode($res, true); //var_dump($res); if($res['success']) { // Проверка каптчи пройдена успешно, продолжаем дальше выполнение проверки формы и т.д. } else { // Проверка не пройдена } } else { // Проверка не пройдена } }После выполнения запроса, сервер Google reCAPTCHA 2.0 отдаст ответ в формате JSON с полем success. Если его значение TRUE, то значит проверка пройдена и форму заполняет человек, а не робот. Если success равно FALSE, то форму заполняет спам-робот.
Пример отрицтельного ответа (для его просмотра раскомментируйте в коде строку var_dump($res);
array(3) { ["success"]=> bool(false) ["challenge_ts"]=> string(20) "2017-01-15T12:02:40Z" ["hostname"]=> string(12) "art-apple.ru" }
Проверка пройдена успешно:
array(3) { ["success"]=> bool(true) ["challenge_ts"]=> string(20) "2017-01-15T12:09:40Z" ["hostname"]=> string(12) "art-apple.ru" }Чтобы посмотреть какие данные передаются из формы, вставьте вот этот код в страницу:
foreach ($_POST as $key => $value) { echo 'На этом настройка и установка reCAPTCHA 2.0 от Google завершена и спам больше не будет вас доставать!' . $key.': '.$value.'
'; }