验证码与AJAX验证总是返回错误，即使正确的，当 [英] reCAPTCHA with ajax validation always returns wrong even when correct

查看：3595
本文介绍了验证码与AJAX验证总是返回错误，即使正确的，当的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

活生生的例子是如下： http://www.uslegalsupport.com/contact-us - 新/

基本上，当您填写进入的必修课领域的形式，如果你输入正确或不正确的验证码，它说，它是无效的。我检查了所有我能想到的，比起来， HTTP：/ /www.jquery4u.com/forms/setup-user-friendly-captcha-jqueryphp/ - 我似乎无法弄清楚它是什么，我缺少和/或做错了

。

任何帮助是非常AP preciated！

JavaScript的：

 ＆LT;脚本类型=文/ JavaScript的＆GT;
//验证验证码与之前POST操作继续
功能validateCaptcha（）
{
    challengeField = $（＃输入recaptcha_challenge_field）VAL（）。
    responseField = $（＃输入recaptcha_response_field）VAL（）。
    VAR HTML = $阿贾克斯（{
        键入：POST，
        网址：validateform.php
        数据：形式=注册和放大器; recaptcha_challenge_field =+ challengeField +＆放大器; recaptcha_response_field =+ responseField，
        异步：假的
        }）responseText的;
    如果（HTML ==成功）{
        //操作添加到窗体
        $（形式）ATTR（行动，/谢客，为接触美国新/）; //＆LT;  - 你的脚本处理表单
        $（＃提交）ATTR（价值，提交）;
        //指示成功验证码
        $（＃验证码状态）HTML（＆其中，P类= \绿色大胆\＆GT;！成功得益于你现在可以进行＆LT; / P＆gt;中）;
    } 其他 {
        $（＃验证码状态）HTML（＆其中，P类= \红大胆\＆GT; C中的安全$ C $您输入不匹配，请重试＆LT; / P＆gt;中）;
        Recaptcha.reload（）;
    }
}
＆LT; / SCRIPT＆GT;

HTML表单：

 ＆LT;形式ID =注册的方法=邮报行动=JavaScript的：validateCaptcha（）＆GT;

＆LT;输入类=contacinput类型=文本名称=name222占位符=姓名*大小=40需要＆GT;＆LT; BR /＆GT;
＆LT;输入类=contacinput类型=文本名称=company222占位符=公司或律师事务所*大小=40需要＆GT;＆LT; BR /＆GT;
＆LT;输入类=contacinput类型=文本名称=title222占位符=标题*大小=40需要＆GT;＆LT; BR /＆GT;
＆LT;输入类=contacinput类型=文本名称=phone222占位符=电话号码*大小=20需要＆GT;＆LT; BR /＆GT;
＆LT;输入类=contacinput类型=文本名称=email222占位符=邮件*大小=20需要＆GT;＆LT; BR /＆GT;
＆LT;输入类=contacinput类型=文本名称=address222占位符=街道地址大小=20＆GT;＆LT; BR /＆GT;
＆LT;输入类=contacinput类型=文本名称=city222占位符=市大小=20＆GT;＆LT;输入类=contacinput类型=文本名称=state222占位符= 国家大小=5＆GT;＆LT;输入类=contacinput类型=文本名称=zip222占位符=邮编*大小=5需要＆GT;＆LT; BR /＆GT;
＆LT;输入类=contacinput类型=文本名称=subject222占位符=主题*大小=40需要＆GT;＆LT; BR /＆GT;
＆LT; textarea的行数=10COLS =45级=contacinputNAME =message222占位符=消息*需要＆GT;＆LT; / textarea的＆GT;＆LT; BR /＆GT;＆LT; BR /＆GT;

＆所述; / P＆GT;

＆LT; D​​IV ID =验证码换行＆GT;
        ＆LT; D​​IV ID =termsckb换行＆GT;＆其中，P类=黑体＆GT;键入以下（用空格隔开）的话来说：＆LT; / P＆GT;＆LT; / DIV＆GT;
        ＆LT; PHP
        require_once（recaptchalib.php）;
        $公钥=我的公开密钥-是，这里的; //你从注册页面得到这个
        回声recaptcha_get_html（$公钥）;
        ？＆GT;
        ＆LT; D​​IV ID =验证码状态＆GT;＆LT; / DIV＆GT;
＆LT; / DIV＆GT;
            ＆LT; P类=颜色：红色;的id =captchaStatus＆GT;＆安培; NBSP;＆所述; / P＆GT;


＆LT;输入类=wpcf7形式控制wpcf7提交注册submitbtnID =signupbuttonVALUE =提交类型=提交名称=signupbutton/＆GT;

＆LT; /形式GT;

validateform.php：

 ＆LT; PHP
require_once（recaptchalib.php）;

$ privatekey =我-私有密钥是，这里的; //＆LT;！-----你这里的关键
$ RESP = recaptcha_check_answer（$ privatekey，
                              $ _ SERVER [REMOTE_ADDR]，
                              $ _ POST [recaptcha_challenge_field]，
                              $ _ POST [recaptcha_response_field]）;

如果（$ resp-＆GT;！is_valid）{
  //当验证码输入错误会发生什么情况
  //模具（的ReCaptcha输入不正确，请再回去试试＆LT; A HREF = \的JavaScript：history.go（-1）\＆GT;返回＆LT; / A＆gt;中
  //（验证码说：$ resp-＆GT;错误。）
    回声不及格;
} 其他 {
    回声成功;
}

？＆GT;

解决方案

AJAX是异步的。你的 VAR HTML 并按住 XMLHtt prequest 对象的副本，它创造，但你必须要检查 html.onreadystatechange ，确保 html.readyState === 4安培;＆安培; html.status === 200 获得 html.responseText 。使用 $阿贾克斯。（{成功：函数（）{/ *做的东西在这里* /}}）或 $ AJAX（{/ *对象特性* /}）。完成（功能（）{/ *做的东西这里/ *}），来代替。需要注意的是，你不必使用匿名函数，函数名无（）就可以了。

简介：

 函数validateCaptcha（）{
  。VAR challengeField = $（'＃recaptcha_challenge_field）V​​AL（）;
  。VAR responseField = $（'＃recaptcha_response_field）V​​AL（）;
  $阿贾克斯（{
    键入：POST，
    网址：validateform.php，
    数据： en$c$cURI('form=signup&recaptcha_challenge_field='+challengeField+'&recaptcha_response_field='+responseField),
    异步：假的
  }）。完成（功能（RESP）{
    如果（RESP ==='成功'）{
      $（'＃注册）提交（）。
    }
    其他{
      $（'＃验证码状态'）HTML（＆LT; p类='红色粗体'＆gt;您输入的安全code不匹配，请重试＆LT; / P＆gt;中）;
      Recaptcha.reload（）;
    }
  }）;
}

或

 函数validateCaptcha（）{
  。VAR challengeField = $（'＃recaptcha_challenge_field）V​​AL（）;
  。VAR responseField = $（'＃recaptcha_response_field）V​​AL（）;
  $阿贾克斯（{
    键入：POST，
    网址：validateform.php，
    数据： en$c$cURI('form=signup&recaptcha_challenge_field='+challengeField+'&recaptcha_response_field='+responseField),
    异步：假的，
    成功：函数（RESP）{
      如果（RESP ==='成功'）{
        $（'＃注册）提交（）。
      }
      其他{
        $（'＃验证码状态'）HTML（＆LT; p类='红色粗体'＆gt;您输入的安全code不匹配，请重试＆LT; / P＆gt;中）;
        Recaptcha.reload（）;
      }
    }
  }）;
}

和做到这一点：

  $（'＃signupbutton）点击（validateCaptcha）;
$（窗口）.keydown（函数（五）{
  如果（e.key code === 13）{
    validateCaptcha（）;
    返回false;
  }
}

你也应该改变一些你的HTML，如：

 ＆LT;形式ID ='注册'方法='后'行动='/感谢信换接触，美国新的/'＆GT;

和摆脱那种＆LT的; / P＆GT; 标记没有打开的＆LT; P＆GT; 。 而改变你的键入=提交到键入='按钮'：

 ＆LT;输入级='wpcf7形式控制wpcf7提交注册submitbtn'ID ='signupbutton'值=提交类型=按钮NAME ='signupbutton'/ ＆GT;

Live example is as below: http://www.uslegalsupport.com/contact-us-new/

Basically, when you fill out the form entering the required fields of course, if you enter a correct or incorrect captcha, it says it's invalid. I've checked everything I can think of and compared it to http://www.jquery4u.com/forms/setup-user-friendly-captcha-jqueryphp/ - I can't seem to figure out what it is I'm missing and/or doing wrong.

Any help is much appreciated!

JavaScript:

<script type="text/javascript">
//Validate the Recaptcha' Before continuing with POST ACTION
function validateCaptcha()
{
    challengeField = $("input#recaptcha_challenge_field").val();
    responseField = $("input#recaptcha_response_field").val();
    var html = $.ajax({
        type: "POST",
        url: "validateform.php",
        data: "form=signup&recaptcha_challenge_field=" + challengeField + "&recaptcha_response_field=" + responseField,
        async: false
        }).responseText;
    if(html == "success") {
        //Add the Action to the Form
        $("form").attr("action", "/thank-you-for-contacting-us-new/"); //<-- your script to process the form
        $("#submit").attr("value", "Submit");
        //Indicate a Successful Captcha
        $("#captcha-status").html("<p class=\"green bold\">Success! Thanks you may now proceed.</p>");
    } else {
        $("#captcha-status").html("<p class=\"red bold\">The security code you entered did not match. Please try again.</p>");
        Recaptcha.reload();
    }
}
</script>

HTML Form:

<form id="signup" method="post" action="javascript:validateCaptcha()">

<input class="contacinput" type="text" name="name222" placeholder="Name*" size="40" required><br />
<input class="contacinput" type="text" name="company222" placeholder="Company or Law Firm*" size="40" required><br />
<input class="contacinput" type="text" name="title222" placeholder="Title*" size="40" required><br />
<input class="contacinput" type="text" name="phone222" placeholder="Phone Number*" size="20" required><br />
<input class="contacinput" type="text" name="email222" placeholder="Email*" size="20" required><br />
<input class="contacinput" type="text" name="address222" placeholder="Street Address" size="20"><br />
<input class="contacinput" type="text" name="city222" placeholder="City" size="20"><input class="contacinput" type="text" name="state222" placeholder="State" size="5"><input class="contacinput" type="text" name="zip222" placeholder="Zip*" size="5" required><br />
<input class="contacinput" type="text" name="subject222" placeholder="Subject*" size="40" required><br />
<textarea rows="10" cols="45" class="contacinput" name="message222" placeholder="Message*" required></textarea><br /><br />

</p>

<div id="captcha-wrap">
        <div id="termsckb-wrap"><p class="bold">Type in the words below (separated by a space):</p></div>
        <?php
        require_once("recaptchalib.php");
        $publickey = "my-public-key-is-here"; // you got this from the signup page
        echo recaptcha_get_html($publickey);
        ?>
        <div id="captcha-status"></div>
</div>
            <p style="color: red;" id="captchaStatus">&nbsp;</p>


<input class="wpcf7-form-control wpcf7-submit signup submitbtn" id="signupbutton" value="submit" type="submit" name="signupbutton" />

</form>

validateform.php :

<?php 
require_once("recaptchalib.php");

$privatekey = "my-private-key-is-here"; //<!----- your key here
$resp = recaptcha_check_answer ($privatekey,
                              $_SERVER["REMOTE_ADDR"],
                              $_POST["recaptcha_challenge_field"],
                              $_POST["recaptcha_response_field"]);

if (!$resp->is_valid) {
  // What happens when the CAPTCHA was entered incorrectly
  //die ("The reCAPTCHA wasn't entered correctly. Please go back and try it again. <a href=\"javascript:history.go(-1)\">Back</a>"
  //"(reCAPTCHA said: " . $resp->error . ")
    echo "fail";
} else {
    echo "success";
}

?>

解决方案

AJAX is Asynchronous. Your var html does hold a copy of the XMLHttpRequest Object that it creates, but you would have to check html.onreadystatechange, making sure html.readyState === 4 && html.status === 200 to get html.responseText. Use $.ajax({success:function(){/*do stuff here*/}}) or $.ajax({/*Object properties*/}).done(function(){/*do stuff here/*}), instead. Note that you don't have to use Anonymous Functions, Function names without () will do.

Synopsis:

function validateCaptcha(){
  var challengeField = $('#recaptcha_challenge_field').val();
  var responseField = $('#recaptcha_response_field').val();
  $.ajax({
    type: 'POST',
    url: 'validateform.php',
    data: encodeURI('form=signup&recaptcha_challenge_field='+challengeField+'&recaptcha_response_field='+responseField),
    async: false
  }).done(function(resp){
    if(resp === 'success'){
      $('#signup').submit();
    }
    else{
      $('#captcha-status').html("<p class='red bold'>The security code you entered did not match. Please try again.</p>");
      Recaptcha.reload();
    }
  });
}

or

function validateCaptcha(){
  var challengeField = $('#recaptcha_challenge_field').val();
  var responseField = $('#recaptcha_response_field').val();
  $.ajax({
    type: 'POST',
    url: 'validateform.php',
    data: encodeURI('form=signup&recaptcha_challenge_field='+challengeField+'&recaptcha_response_field='+responseField),
    async: false,
    success: function(resp){
      if(resp === 'success'){
        $('#signup').submit();
      }
      else{
        $('#captcha-status').html("<p class='red bold'>The security code you entered did not match. Please try again.</p>");
        Recaptcha.reload();
      }
    }
  });
}

And do this:

$('#signupbutton').click(validateCaptcha);
$(window).keydown(function(e){
  if(e.keyCode === 13){
    validateCaptcha();
    return false;
  }
}

Also you should change some of your HTML, like:

<form id='signup' method='post' action='/thank-you-for-contacting-us-new/'>

And get rid of that </p> tag that has no opening <p>. And change your type='submit' to type='button':

<input class='wpcf7-form-control wpcf7-submit signup submitbtn' id='signupbutton' value='submit' type='button' name='signupbutton' />

这篇关于验证码与AJAX验证总是返回错误，即使正确的，当的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
PHP最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆