Как проверить Google reCaptcha в форме Отправить

Question

Недавно Google полностью переработал свой API reCaptcha и упростил его до одного флажка.

Проблема заключается в том, что я могу отправить форму с ReCaptcha включен без проверки и формы будет игнорировать ReCaptcha.

Прежде чем вам нужно было отправить форму в файл PHP с помощью закрытого ключа и др., Но я не вижу упоминания об этом в их руководстве для разработчиков. Я не знаю, как проверить форму, чтобы убедиться, что новый reCaptcha был заполнен пользователем.

Я что-то упустил? Этот файл PHP с закрытым ключом все еще требуется?

Все, что я за ReCaptcha до сих пор:

<div data-type="image" class="g-recaptcha" data-sitekey="My Public Key"></div> 

Answer 1

Если вы хотите, чтобы проверить, если пользователь нажал на I'm not a robot флажке, вы можете использовать функцию .getResponse() предоставленной API ReCaptcha.

Он возвращает пустую строку в случае, если пользователь не проверяла себя, что-то вроде этого:

if (grecaptcha.getResponse() == ""){ 
    alert("You can't proceed!"); 
} else { 
    alert("Thank you"); 
} 

В случае если Пользователь подтверждено себя, ответ будет очень длинная строка.

Подробнее об API можно найти на этой странице: reCaptcha Javascript API

Answer 2

Попробуйте эту ссылку: https://github.com/google/ReCAPTCHA/tree/master/php

Ссылка на эту страницу размещена в самом низу этой страницы: https://developers.google.com/recaptcha/intro

Одна из проблем, с которой я столкнулся, помешала работе этих двух файлов с моим файлом php.ini для веб-сайта. Убедитесь, что это свойство настроено правильно, следующим образом: allow_url_fopen = О

Answer 3

var googleResponse = jQuery('#g-recaptcha-response').val(); 
if (!googleResponse) { 
    $('<p style="color:red !important" class=error-captcha"><span class="glyphicon glyphicon-remove " ></span> Please fill up the captcha.</p>" ').insertAfter("#html_element"); 
    return false; 
} else {    
    return true; 
} 

Поместите это в функции. Вызовите эту функцию для отправки ... #html_element - мой пустой div.

Answer 4

При использовании Google reCaptcha с reCaptchaDLL файлами мы можем подтвердить в C#.

RecaptchaControl1.Validate(); 
bool Varify = RecaptchaControl1.IsValid; 
if (Varify) 
{ 
    // Pice of code after validation. 
} 

Его работа для меня.

Answer 5

Вы можете проверить реакцию в 3 способами согласно Google reCAPTCHA documentation:

1. g-recaptcha-response: После того, как пользователь проверяет флажок (я не робот), поле с идентификатором g-recaptcha-response получает заполняется в вашем HTML.
   Теперь вы можете использовать значение этого поля, чтобы узнать, является ли пользователь бот или нет, используя ниже mentioed линии: -

   var captchResponse = $('#g-recaptcha-response').val(); 
   if(captchResponse.length == 0) 
       //user has not yet checked the 'I am not a robot' checkbox 
   else 
       //user is a verified human and you are good to submit your form now 
   

2. Прежде чем вы собираетесь отправить форму, вы можете сделать называют следующим образом: -

   var isCaptchaValidated = false; 
   var response = grecaptcha.getResponse(); 
   if(response.length == 0) { 
       isCaptchaValidated = false; 
       toast('Please verify that you are a Human.'); 
   } else { 
       isCaptchaValidated = true; 
   } 
   
   
   if (isCaptchaValidated) { 
       //you can now submit your form 
   } 
   

3. Вы можете отображать ReCaptcha следующим образом: -

   <div class="col s12 g-recaptcha" data-sitekey="YOUR_PRIVATE_KEY" data-callback='doSomething'></div> 
   

   а затем определить functi в вашем JavaScript, который также можно использовать для отправки вашей формы.

   function doSomething() { alert(1); } 
   

   Теперь, когда флажок (я не робот) проверяется, вы получите обратный вызов определенной функции обратного вызова, который находится в вашем случае doSomething.

Answer 6

var googleResponse = $('#g-recaptcha-response').val(); 

if(googleResponse=='') 
{ 
    $("#texterr").html("<span>Please check reCaptcha to continue.</span>"); 

    return false; 
} 

Answer 7

Вы можете сначала проверить в сторону внешнего интерфейса, что флажок отмечен:

var recaptchaRes = grecaptcha.getResponse(); 
    var message = ""; 

    if(recaptchaRes.length == 0) { 
     // You can return the message to user 
     message = "Please complete the reCAPTCHA challenge!"; 
     return false; 
    } else { 
     // Add reCAPTCHA response to the POST 
     form.recaptchaRes = recaptchaRes; 
    } 

А затем на стороне сервера проверить полученный ответ с помощью Google ReCaptcha API:

$receivedRecaptcha = $_POST['recaptchaRes']; 
    $verifiedRecaptcha = file_get_contents('https://www.google.com/recaptcha/api/siteverify?secret='.$google_secret.'&response='.$receivedRecaptcha); 

    $verResponseData = json_decode($verifiedRecaptcha); 

    if(!$verResponseData->success) 
    { 
     return "reCAPTCHA is not valid; Please try again!"; 
    } 

Для получения дополнительной информации вы можете посетить Google docs.

Answer 8

С точки зрения UX, это может помочь визуально узнать пользователя, когда они могут приступить к отправке формы - либо включив отключенную кнопку, либо просто сделав кнопку видимой.

Вот простой пример ...

<form> 
    <div class="g-recaptcha" data-sitekey="YOUR_PRIVATE_KEY" data-callback="recaptchaCallback"></div> 
    <button type="submit" class="btn btn-default hidden" id="btnSubmit">Submit</button> 
</form> 

<script> 
    function recaptchaCallback() { 
     var btnSubmit = document.getElementById("btnSubmit"); 

     if (btnSubmit.classList.contains("hidden")) { 
      btnSubmit.classList.remove("hidden"); 
      btnSubmitclassList.add("show"); 
     } 
    } 
</script>