Comment valider Google reCaptcha sur le formulaire soumettre

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

mettez ceci dans une fonction. Appeler cette fonction sur "soumettre"... #html_element est ma div vide.

vous pouvez vérifier la réponse de 3 façons selon le Google reCAPTCHA documentation:

1. g-recaptcha-response: une fois que l'Utilisateur a coché la case (Je ne suis pas un robot), un champ avec id g-recaptcha-response est rempli dans votre HTML.
   
   Vous pouvez maintenant utiliser la valeur de ce champ pour savoir si l'utilisateur est un bot ou non, en utilisant les lignes ci-dessous mentionnées: -

   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. avant de soumettre votre formulaire, vous pouvez faire un appel comme suit:-

   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. vous pouvez afficher votre reCAPTCHA comme suit: -

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

   Et ensuite définir la fonction dans votre code JavaScript, qui peut également être utilisé pour soumettre votre formulaire.

   function doSomething() { alert(1); }
   

   maintenant, une fois que la case à cocher (Je ne suis pas un robot) est cochée, vous obtiendrez un callback vers le callback défini, qui est doSomething dans votre cas.

du point de vue UX, il peut être utile de faire savoir de façon visible à l'utilisateur quand il peut soumettre le formulaire - soit en activant un bouton désactivé, soit simplement en rendant le bouton visible.

Voici un exemple 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>

Essayez ce lien: https://github.com/google/ReCAPTCHA/tree/master/php

Un lien à cette page est affichée au bas de cette page: https://developers.google.com/recaptcha/intro

un problème que j'ai trouvé qui a empêché ces deux fichiers de fonctionner correctement était avec mon php.fichier ini pour le site web. Assurez-vous que cette propriété est correctement installé, comme suit: allow_url_fopen = On

Vous pouvez d'abord vérifier dans le frontend côté que la case est cochée:

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

puis, côté serveur, vérifiez la réponse reçue en utilisant L'API Google reCAPTCHA:

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

Pour plus d'info vous pouvez visiter Google docs.

Vérifier Google reCapcha est valide ou non après la soumettre le formulaire

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

lorsque vous utilisez Google reCaptchareCaptchaDLL le fichier, puis nous pouvons valider par C#.

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

Son travail pour moi.

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