Недавно Google полностью переработал свой API reCaptcha и упростил его до одного флажка.
Проблема в том, что я могу представить форму с включенной reCaptcha без ее проверки, и форма будет игнорировать reCaptcha.
Прежде чем отправлять форму в файл PHP с помощью private key и др., Я не вижу упоминания об этом в их Руководстве для разработчиков. Я не знаю, как проверить форму, чтобы убедиться, что новый reCaptcha был заполнен пользователем.
Я что-то упускаю? Этот файл PHP с закрытым ключом все еще требуется?
Все, что у меня есть для reCaptcha, пока:
<div data-type="image" class="g-recaptcha" data-sitekey="My Public Key"></div>
Если вы хотите проверить, нажал ли Пользователь флажок « I'm not a robot
, вы можете использовать .getResponse()
предоставляемую API reCaptcha.
Он вернет пустую строку в случае, если Пользователь не подтвердил себя, что-то вроде этого:
if (grecaptcha.getResponse() == ""){ alert("You can't proceed!"); } else { alert("Thank you"); }
В случае, если Пользователь выполнил проверку, ответ будет очень длинной.
Подробнее об API можно найти на этой странице: reCaptcha API Javascript
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; }
Поместите это в функцию. Вызовите эту функцию на submit … #html_element
– мой пустой div.
Вы можете проверить ответ тремя способами в соответствии с документацией Google reCAPTCHA :
g-recaptcha-response
: после того, как пользователь проверит флажок (я не робот), поле с идентификатором g-recaptcha-response
будет заполнено в вашем HTML.
Теперь вы можете использовать значение этого поля, чтобы узнать, является ли пользователь ботом или нет, используя приведенные ниже строки:
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
Прежде чем вы отправите свою форму, вы можете позвонить:
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 }
Вы можете отобразить reCAPTCHA следующим образом:
<div class="col s12 g-recaptcha" data-sitekey="YOUR_PRIVATE_KEY" data-callback='doSomething'></div>
А затем определите функцию в вашем JavaScript, которая также может быть использована для отправки вашей формы.
function doSomething() { alert(1); }
Теперь, когда флажок (я не робот) проверен, вы получите обратный вызов к определенному doSomething
вызову, который doSomething
в вашем случае.
С точки зрения 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>
Попробуйте эту ссылку: https://github.com/google/ReCAPTCHA/tree/master/php
Ссылка на эту страницу размещена в самой нижней части этой страницы: https://developers.google.com/recaptcha/intro
Одна из проблем, с которой я столкнулся, помешала работе этих двух файлов, была связана с моим файлом php.ini для веб-сайта. Убедитесь, что это свойство настроено правильно, следующим образом: allow_url_fopen = On
при использовании Google recaptcha с recaptcha DLL-файлом, то мы можем проверить на C #
RecaptchaControl1.Validate(); bool Varify = RecaptchaControl1.IsValid; if (Varify) { // Pice of code after validation. }
Его работа для меня.
Вы можете сначала проверить на стороне интерфейса, что флажок отмечен:
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; }
И затем на стороне сервера проверьте полученный ответ с помощью API reCAPTCHA Google:
$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 .
var googleResponse = $('#g-recaptcha-response').val(); if(googleResponse=='') { $("#texterr").html("<span>Please check reCaptcha to continue.</span>"); return false; }