Установка и настройка reCAPTCHA 2.0 от Google

В этой статье рассмотрим установку и настройку новой версии 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 имеет значение, а это значит что сервер проверки ответил нам на запрос и проверка пройдена удачно.

Готовим функцию подключения к серверу. В 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 '
' . $key.': '.$value.'
'; }

На этом настройка и установка reCAPTCHA 2.0 от Google завершена и спам больше не будет вас доставать!