最近，谷歌彻底改进了他们的reCaptcha API，并将其简化为一个复选框。
问题是，我可以在没有勾选reCaptcha的情况下提交带有reCaptcha的表单，而表单将忽略reCaptcha。
以前，您必须将表单发送到带有私钥等参数的PHP文件，但在他们的开发人员指南中我没有看到任何提及。我不知道如何验证表单以确保用户填写了新的reCaptcha。
难道我漏掉了什么吗？那个带有私钥的PHP文件还是必需的吗？
到目前为止，我的reCaptcha只有：
<div data-type="image" class="g-recaptcha" data-sitekey="My Public Key"></div>
if (grecaptcha.getResponse() == ""){
alert("You can't proceed!");
} else {
alert("Thank you");
}
g-recaptcha-response：一旦用户选中复选框（我不是机器人），一个带有id 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。
从用户体验角度来看，有助于明确告知用户何时可以提交表单 - 可以通过启用已禁用的按钮或仅仅使按钮可见来实现。
以下是一个简单的示例...
<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>
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。
使用JavaScript时，它对我有效。
<script src='https://www.google.com/recaptcha/api.js'></script>
<script>
function submitUserForm() {
var response = grecaptcha.getResponse();
if(response.length == 0) {
document.getElementById('g-recaptcha-error').innerHTML = '<span style="color:red;">This field is required.</span>';
return false;
}
return true;
}
function verifyCaptcha() {
document.getElementById('g-recaptcha-error').innerHTML = '';
}
</script><form method="post" onsubmit="return submitUserForm();">
<div class="g-recaptcha" data-sitekey="YOUR_SITE_KEY" data-callback="verifyCaptcha"></div>
<div id="g-recaptcha-error"></div>
<input type="submit" name="submit" value="Submit" />
</form> 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文档。
在表单提交后验证Google reCaptcha是否有效
if ($post['g-recaptcha-response']) {
$captcha = $post['g-recaptcha-response'];
$secretKey = 'type here private key';
$response = file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=" . $secretKey . "&response=" . $captcha);
$responseKeys = json_decode($response, true);
if (intval($responseKeys["success"]) !== 1) {
return "failed";
} else {
return "success";
}
}
else {
return "failed";
}
var googleResponse = $('#g-recaptcha-response').val();
if(googleResponse=='')
{
$("#texterr").html("<span>Please check reCaptcha to continue.</span>");
return false;
}
在使用带有reCaptcha DLL文件的Google reCaptcha时，我们可以按照以下方式在C#中进行验证：
RecaptchaControl1.Validate();
bool _Varify = RecaptchaControl1.IsValid;
if (_Varify)
{
// Pice of code after validation.
}
对我有效。
grecaptcha.getResponse(widget1);。 - Ali Bassam