首页 > 解决方案 > 当我使用 POST 方法发送验证码响应时,为什么我的谷歌响应为空?

问题描述

我来这里寻求帮助,因为尽管这个主题有很多主题,但没有答案让我解决了我的问题:

原理很简单:我有一个下面的表单,其中包含一个包含验证码的 div,我的 HTML 还包含加载验证码的脚本:

<form id="contactformpage">
          <div class="messages"></div>
          <div class="form-group row">
            <label for="societepage" class="col-sm-6 col-form-label">Société</label>
            <div class="col-sm-6 champ">
              <input type="text" name="societe" class="form-control" id="societepage" placeholder="Nom de la société"
                aria-describedby="indicsocietepage" required pattern =".{1,100}">
              <small id="indicsociete" class="form-text text-muted"> * Obligatoire </small>
            </div>
          </div>
          <div class="form-group row">
            <label for="adressepage" class="col-sm-6 col-form-label">Adresse</label>
            <div class="col-sm-6 champ">
              <input type="text" name="adresse" class="form-control" id="adressepage" placeholder="Adresse">
            </div>
          </div>
          <div class="form-group row">
            <label for="codepostaletvillepage" class="col-sm-6 col-form-label">Code postal & ville</label>
            <div class="col-sm-6 champ">
              <input type="text" class="form-control" name="codepostaletville" id="codepostaletvillepage"
                placeholder="Code postal & ville">
            </div>
          </div>
          <div class="form-group row">
            <label for="contactpage" class="col-sm-6 col-form-label">Nom du contact</label>
            <div class="col-sm-6 champ">
              <input type="text" class="form-control" name="contact" id="contactpage" placeholder="Nom du contact">
            </div>
          </div>
          <div class="form-group row">
            <label for="telephonepage" class="col-sm-6 col-form-label">Téléphone</label>
            <div class="col-sm-6 champ">
              <input type="tel" class="form-control" name="téléphone" id="telephonepage" placeholder="Numéro de téléphone"
                aria-describedby="indictelephonepage" required pattern="^(?:0|\(?\+33\)?\s?|0033\s?)[1-79](?:[\.\-\s]?\d\d){4}$">
              <small id="indictelephonepage" class="form-text text-muted"> * Obligatoire </small>
            </div>
          </div>
          <div class="form-group row">
            <label for="mailpage" class="col-sm-6 col-form-label">Adresse mail</label>
            <div class="col-sm-6 champ">
              <input type="email" class="form-control" name="mail" id="mailpage" placeholder="Entrez votre adresse mail"
                aria-describedby="indicmailpage" required>
              <small id="indicmailpage" class="form-text text-muted"> * Obligatoire </small>
            </div>
          </div>
          <div class="form-group row">
            <label class="col-sm-6 col-form-label" for="selecmarque" aria-describedby="indicmarquepage"> Marque du véhicule
            </label>
            <div class="col-sm-6 champ">
              <select class="form-control" name="marque" style="height:20px;padding-bottom:0;padding-top:1;"
                onchange="generechoixmodele('selecmarque','apreschoixmarquepage','apreschoixmodelepage','nommodelepage','choixmodelepage','choixtypepage');"
                id="selecmarque">
                <option selected> Séléctionnez </option>
              </select>
              <small id="indicmarquepage" class="form-text text-muted"> * Obligatoire </small>
            </div>
          </div>
          <div class="form-group row" id="apreschoixmarquepage" style="display:none;">
            <!-- Liste déroulante qui apparait après le choix de la marque -->
            <label class="col-sm-6 col-form-label" for="apreschoixmarquepage" aria-describedby="indicmarque"
              id="nommodelepage"></label>
            <div class="col-sm-6 champ">
              <select class="form-control" name="modele" style="height:20px;padding-bottom:0;padding-top:1;"
                id="choixmodelepage"
                onchange="generechoixtype('selecmarque','choixmodelepage','apreschoixmodelepage','nomtypepage','choixtypepage');">
              </select>
            </div>
          </div>
          <div class="form-group row" id="apreschoixmodelepage" style="display:none;">
            <!-- Liste déroulante qui apparait après le choix du modèle -->
            <label class="col-sm-6 col-form-label" for="apreschoixmodelepage" aria-describedby="indicmarque"
              id="nomtypepage"></label>
            <div class="col-sm-6 champ">
              <select class="form-control" name="type" style="height:20px;padding-bottom:0;padding-top:1;" id="choixtypepage">
              </select>
            </div>
          </div>
          <p> Je souhaite recevoir les catalogues suivants (dynamique)</p>
          <div id="choixcataloguepage">
          </div>
          <div class="form-group row">
            <label class="col-sm-6 col-form-label" for="commentairepage">Commentaire</label>
            <div class="col-sm-6 champ">
              <textarea class="form-control" name="commentaire" id="commentairepage" rows="1"></textarea>
            </div>
          </div>
          <div class="form-group row" style="margin-top:5px;">
            <label for="captchapage" class="col-sm-6 col-form-label" style="margin-top:10px;">Captcha</label>
            <div class="col-sm-6 champ captcha" >
              <div class="g-recaptcha" id="captchapage" data-sitekey="6LfYqq8UAAAAAGi_ImKvNYvAhNLysLCf9SoD3gZd" data-badge="inline" style="transform:scale(0.74);-webkit-transform:scale(0.74);transform-origin:0 0;-webkit-transform-origin:0 0;"> </div>
            </div>
          </div>
          <input type="submit" class="btn" id="submitpage">
        </form>

然后在验证此表单期间,我检索表单中输入的数据,以及 Google 带来的验证码的响应(“grecaptcha.getResponse ()”),以便通过 Ajax 请求在 php 页面上发送它们:

$(document).ready(function(){
$("#contactformpage").submit(function(e){
  e.preventDefault();
  if (document.getElementById("selecmarque").value=="Séléctionnez") {
    alert("Séléctionnez une marque (Obligatoire)");
  }
  else {
    var cases = document.getElementById("contactformpage").getElementsByClassName("form-check");
    var catalogues = [];
    for (var i = 0; i < cases.length; i++) {
      if ($(cases[i].firstChild).prop("checked")==true) {
        catalogues[i]=cases[i].lastChild.innerHTML;
    }
    else {
    }
  }
    $.ajax({
        type: "POST",
        url: 'sendform.php',
        data: {
            societe : $("#societepage").val(),
            adresse : $("#adressepage").val(),
            codepostaletville : $("#codepostaletvillepage").val(),
            contact : $("#contactpage").val(),
            telephone : $("#telephonepage").val(),
            mail : $("#mailpage").val(),
            marqueclient : $("#selecmarque").val(),
            modeleclient : $("#choixmodelepage").val(),
            typeclient : $("#choixtypepage").val(),
            catalogues : JSON.stringify(catalogues),
            commentaire : $("#commentairepage").val(),
            captcha: grecaptcha.getResponse()

        },

        success: function (data)
        {
            var messageAlert = 'alert-' + data.type;
            var messageText = data.message;

            // let's compose Bootstrap alert box HTML
            var alertBox = '<div class="alert ' + messageAlert + ' alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>' + messageText + '</div>';

            // If we have messageAlert and messageText
            if (messageAlert && messageText) {
                // inject the alert to .messages div in our form
                $('#contactformpage').find('.messages').html(alertBox);
                // empty the form
                $('#contactformpage')[0].reset();
                grecaptcha.reset();
            }
        },
        error: function(xhr, status, error){
          var errorMessage = xhr.status + ': ' + xhr.statusText
          alert('Error - ' + errorMessage);
        }
    })
  }
});

});

这是我得到验证码答案的 php 脚本,根据这个答案,我执行一项任务或其他任务:

        try {
  if (isset($_POST['captcha'])) {
        $captcha = $_POST['captcha'];
        $privatekey='6LfYqq8UAAAAAJHL90FXgdCjEIDYtY2HhkGw7sbs';
        $url = 'https://www.google.com/recaptcha/api/siteverify';
        $data = array(
            'secret' => $privatekey,
            'response' => $captcha,
            'remoteip' => $_SERVER['REMOTE_ADDR']
        );
        $curlConfig = array(
            CURLOPT_URL => $url,
            CURLOPT_POST => true,
            CURLOPT_RETURNTRANSFER => true,
            CURLOPT_POSTFIELDS => $data
        );
        $ch = curl_init();
        curl_setopt_array($ch, $curlConfig);
        $response = curl_exec($ch);
        curl_close($ch);

        $jsonResponse = json_decode($response);
        var_dump($response);
      if ($jsonResponse->success === true) {
        }
        else {
          throw new \Exception('Vous êtes un robot');
        }
      }
}

我的问题是脚本$jsonResponse->success === true一直在验证条件,我尝试制作 avar_dump($jsonResponse)而这个总是null. 这是我执行 Ajax 请求时发送的数据:

使用 Ajax 请求发送的数据

标签: phpajaxresponserecaptchagrecaptcha

解决方案


推荐阅读