10.02.2021 - ЖЗГ

Установка капчи reCAPTCHA v2 на сайт без отправки формы

10.02.2021 Павел Грибов PHP

Технически задача выглядит так: на клиенте пользователь нажимает галочку «Я не робот» (описание от Google), по нажатии какойто кнопки — проверяем деймтвитель но ли капча пройдена.

Html (клиент):

<script type="text/javascript">
              var onloadCallback = function() {
                grecaptcha.render('capcha_element', {
                  'sitekey' : 'ключ сайта',
                   hl : "ru"
                });
              };
</script>
<div class="border border-light p-5" id="RegistrationDiv">
    <p class="h4 mb-4 text-center">Регистрация</p>        
    <input type="email" name="RegisterFormEmail" id="RegisterFormEmail" class="form-control mb-4" placeholder="E-mail">    
    <input type="password" name="RegisterFormPassword" id="RegisterFormPassword" class="form-control" placeholder="Пароль" aria-describedby="RegisterFormPasswordHelpBlock">
    <small id="RegisterFormPasswordHelpBlock" class="form-text text-muted mb-4">Минимальная длина 8 симоволов</small>

    <div id="capcha_element"></div>    

    <button id="RegistrationStartButton" onclick="RegistrationStart()" class="btn btn-success my-4 btn-block">Зарегистрироваться</button>
</div>
<script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit" async defer></script>
<script>
function GetCapchaData(){
if (typeof grecaptcha.getResponse=="function") {
return grecaptcha.getResponse(); 
} else {
return ""; 
};
}
function RegistrationStart(){ 
$.post("registration.php", {
capcha: GetCapchaData()
})
.done(function( data ) {
});
}
</script>

var onloadCallback = function() {

grecaptcha.render('capcha_element', {

'sitekey' : 'ключ сайта',

hl : "ru"

});

};

</script>

<p class="h4 mb-4 text-center">Регистрация</p>

<small id="RegisterFormPasswordHelpBlock" class="form-text text-muted mb-4">Минимальная длина 8 симоволов</small>

<button id="RegistrationStartButton" onclick="RegistrationStart()" class="btn btn-success my-4 btn-block">Зарегистрироваться</button>

</div>

function GetCapchaData(){

if (typeof grecaptcha.getResponse=="function") {

return grecaptcha.getResponse();

} else {

return "";

};

}

function RegistrationStart(){

$.post("registration.php", {

capcha: GetCapchaData()

})

.done(function( data ) {

});

}

</script>

PHP (сервер)

<?php
        $res=GetResponseCapcha($capcha);
        if (isset($res->success)):
           if ($res->success==true):
                  // капча пройдена, чтото делаем дальше
               else:
		 // это робот - пишем ошибку
           endif;
        endif;

function GetResponseCapcha($capcha){
    $ch = curl_init("https://www.google.com/recaptcha/api/siteverify");                
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
        curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
        $js["secret"]="секретный ключ сайта";
        $js["response"]=$capcha;
        curl_setopt($ch, CURLOPT_POST, 1);
        curl_setopt($ch, CURLOPT_POSTFIELDS, $js);
        $res= json_decode(curl_exec($ch));    
   return $res;
}

<?php

$res=GetResponseCapcha($capcha);

if (isset($res->success)):

if ($res->success==true):

// капча пройдена, чтото делаем дальше

else:

// это робот - пишем ошибку

endif;

function GetResponseCapcha($capcha){

$ch = curl_init("https://www.google.com/recaptcha/api/siteverify");

curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);

curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);

curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);

$js["secret"]="секретный ключ сайта";

$js["response"]=$capcha;

curl_setopt($ch, CURLOPT_POST, 1);

curl_setopt($ch, CURLOPT_POSTFIELDS, $js);

$res= json_decode(curl_exec($ch));

return $res;

}

Оставить комментарий google+, Jquery, php, reCAPTCHA

Пн	Вт	Ср	Чт	Пт	Сб	Вс
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