recaptchalib google example php html recaptcha

google - recaptcha v3 php



Cómo validar Google reCaptcha en el formulario Enviar (10)

Al utilizar Google reCaptcha con el archivo DLL reCaptcha , podemos validarlo en C# .

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

Es trabajo para mi

Recientemente, Google revisó por completo su API de ReCaptcha y la simplificó en una sola casilla de verificación.

El problema es que puedo enviar un formulario con el reCaptcha incluido sin verificarlo y el formulario ignorará el reCaptcha.

Antes tenía que enviar el formulario a un archivo PHP con la clave privada, etc., pero no veo ninguna mención de eso en su Guía del desarrollador. No tengo idea de cómo validar el formulario para asegurarme de que el usuario rellene el nuevo ReCaptcha.

¿Me estoy perdiendo de algo? ¿Todavía se requiere ese archivo PHP con la clave privada?

Todo lo que tengo para reCaptcha hasta ahora es:

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


Desde la perspectiva de UX, puede ayudar a que el usuario sepa visiblemente cuándo pueden enviar el formulario, ya sea habilitando un botón desactivado o simplemente haciendo que el botón sea visible.

Aquí hay un ejemplo simple ...

<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>


Primero puede verificar en el lado de la interfaz que la casilla está marcada:

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; }

Y luego, en el lado del servidor, verifique la respuesta recibida utilizando 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!"; }

Para obtener más información, puede visitar Google docs .



Puede verificar la respuesta de 3 maneras según la documentación de Google reCAPTCHA :

  1. g-recaptcha-response : Una vez que el usuario g-recaptcha-response la casilla (no soy un robot), un campo con id g-recaptcha-response se rellena en su HTML.
    Ahora puede usar el valor de este campo para saber si el usuario es un bot o no, utilizando las siguientes líneas:

    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. Antes de enviar su formulario, puede realizar una llamada de la siguiente manera:

    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. Puede mostrar su reCAPTCHA de la siguiente manera:

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

    Y luego defina la función en su JavaScript, que también puede usarse para enviar su formulario.

    function doSomething() { alert(1); }

    Ahora, una vez que se marca la casilla de verificación (no soy un robot), obtendrá una devolución de llamada a la devolución de llamada definida, que es algo en su caso.


Si desea verificar si el Usuario hizo clic en la casilla I''m not a robot , puede usar la función .getResponse() proporcionada por la API de ReCaptcha.

Devolverá una cadena vacía en caso de que el Usuario no se haya validado a sí mismo, algo como esto:

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

En caso de que el Usuario se haya validado a sí mismo, la respuesta será una cadena muy larga.

Puede encontrar más información sobre la API en esta página: reCaptcha JavaScript API


Verifique que Google reCapcha sea válido o no después de enviar el formulario

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"; }


//validate $receivedRecaptcha = $_POST[''recaptchaRes'']; $google_secret = "Yoursecretgooglepapikey"; $verifiedRecaptchaUrl = ''https://www.google.com/recaptcha/api/siteverify?secret=''.$google_secret.''&response=''.$receivedRecaptcha; $handle = curl_init($verifiedRecaptchaUrl); curl_setopt($handle, CURLOPT_RETURNTRANSFER, TRUE); curl_setopt($handle, CURLOPT_SSL_VERIFYPEER, false); // not safe but works //curl_setopt($handle, CURLOPT_CAINFO, "./my_cert.pem"); // safe $response = curl_exec($handle); $httpCode = curl_getinfo($handle, CURLINFO_HTTP_CODE); curl_close($handle); if ($httpCode >= 200 && $httpCode < 300) { if (strlen($response) > 0) { $responseobj = json_decode($response); if(!$responseobj->success) { echo "reCAPTCHA is not valid. Please try again!"; } else { echo "reCAPTCHA is valid."; } } } else { echo "curl failed. http code is ".$httpCode; }


var googleResponse = $(''#g-recaptcha-response'').val(); if(googleResponse=='''') { $("#texterr").html("<span>Please check reCaptcha to continue.</span>"); return false; }


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; }

Pon esto en una función. Llame a esta función en submit ... #html_element es mi div vacío.