使用javascript在php中进行验证码验证

使用javascript在php中进行验证码验证,javascript,php,jquery,html,ajax,Javascript,Php,Jquery,Html,Ajax,我有一个comments表单,它使用ajax通过弹出菜单显示comments框,在提交评论时,评论会被注册到相应的帖子中(没有任何页面刷新)。我想将验证码添加到此表单中 我尝试实现以下javascript代码,该代码生成一个小的随机数字验证码 <p> <label for="code">Write code below > <span id="txtCaptchaDiv" style="color:#F00"></span>&l

我有一个comments表单,它使用ajax通过弹出菜单显示comments框,在提交评论时,评论会被注册到相应的帖子中(没有任何页面刷新)。我想将验证码添加到此表单中

我尝试实现以下javascript代码,该代码生成一个小的随机数字验证码

<p>

      <label for="code">Write code below > <span id="txtCaptchaDiv" style="color:#F00"></span><!-- this is where the script will place the generated code -->

      <input type="hidden" id="txtCaptcha" /></label><!-- this is where the script will place a copy of the code for validation: this is a hidden field -->

      <input type="text" name="txtInput" id="txtInput" size="30" />

</p>

在下面编写代码>

上面的html用于显示生成的验证码和文本输入,供用户输入代码

以下是生成代码的javascript代码-

<script type="text/javascript">
//Generates the captcha function    
    var a = Math.ceil(Math.random() * 9)+ '';
    var b = Math.ceil(Math.random() * 9)+ '';       
    var c = Math.ceil(Math.random() * 9)+ '';  
    var d = Math.ceil(Math.random() * 9)+ '';  
    var e = Math.ceil(Math.random() * 9)+ '';  

    var code = a + b + c + d + e;
    document.getElementById("txtCaptcha").value = code;
    document.getElementById("txtCaptchaDiv").innerHTML = code;  
</script>

//生成验证码函数
var a=Math.ceil(Math.random()*9)+'';
var b=Math.ceil(Math.random()*9)+'';
var c=Math.ceil(Math.random()*9)+'';
var d=Math.ceil(Math.random()*9)+'';
var e=Math.ceil(Math.random()*9)+'';
var代码=a+b+c+d+e;
document.getElementById(“txtCaptcha”).value=code;
document.getElementById(“txtCaptchaDiv”).innerHTML=code;
下一个javascript代码用于验证验证码-

<script type="text/javascript">
function checkform(theform){
    var why = "";

    if(theform.txtInput.value == ""){
        why += "- Security code should not be empty.\n";
    }
    if(theform.txtInput.value != ""){
        if(ValidCaptcha(theform.txtInput.value) == false){
            why += "- Security code did not match.\n";
        }
    }
    if(why != ""){
        alert(why);
        return false;
    }
}

// Validate the Entered input aganist the generated security code function   
function ValidCaptcha(){
    var str1 = removeSpaces(document.getElementById('txtCaptcha').value);
    var str2 = removeSpaces(document.getElementById('txtInput').value);
    if (str1 == str2){
        return true;    
    }else{
        return false;
    }
}

// Remove the spaces from the entered and generated code
function removeSpaces(string){
    return string.split(' ').join('');
}

</script>

函数检查表(theform){
var为什么=”;
if(theform.txtInput.value==“”){
为什么+=“-安全代码不应为空。\n”;
}
if(theform.txtInput.value!=“”){
if(ValidCaptcha(theform.txtInput.value)==false){
为什么+=“-安全代码不匹配。\n”;
}
}
如果(为什么!=“”){
警惕(为什么);
返回false;
}
}
//根据生成的安全代码函数验证输入的输入
函数ValidCaptcha(){
var str1=removespace(document.getElementById('txtCaptcha').value);
var str2=removespace(document.getElementById('txtInput').value);
如果(str1==str2){
返回true;
}否则{
返回false;
}
}
//从输入和生成的代码中删除空格
函数RemoveSpace(字符串){
返回字符串.split(“”).join(“”);
}
当不与注释表单组合时,此代码可以正常工作。与注释表单组合时,不会进行验证

对于基于ajax的评论表单,提交按钮在提交评论时传递一个隐藏的输入变量,该变量将评论与适当的帖子关联起来。 这是“我的评论”部分的“提交”按钮代码-

<button type="submit" class="comment-submit btn submit" id="submitted" name="submitted" value="submitted"><?php _e( 'Submit', APP_TD ); ?></button>

<input  type='hidden' name='comment_post_ID' value='<?php echo $post->ID; ?>' id='comment_post_ID' />


仅为验证码使用Javascript不是一个好主意。由于您的安全只在客户端完成

您的解决方案是使用一种方法停止表单提交,并且仅当captcha函数返回true时,才提交表单数据。这可以通过不同的方式完成,例如jquery:

$('.comment-submit').click(function(e){
  e.preventDefault();
  if (ValidCaptcha()) {
    yourFormElement.submit();
  }
});

您当前创建和验证验证码的策略是一个坏主意,请参阅。例如,要使您的验证码具有保护网页的任何意义,您必须在服务器端生成验证码,而不是与客户端共享解决方案。通过将值从txtCaptcha复制到txtInput,很容易破坏您的验证码。哦,事实上,这是对的,所以我想我已经使用php本身建立了一个更安全的验证码。将php中的验证码分配给会话,以便您可以检查输入和实际的验证码文本。。。如果你想要它,AJAX只需在Ajax调用上生成一个链接,在那里CAPTCHA生成。也考虑使用而不是滚动你自己的-它是相当好的文档和安全的。你好,Froxz,谢谢你的评论,你能解释一下我将如何在ajax调用上放置链接吗?