CAPTCHA失败显示警报,但表单自动提交如何停止此操作

时间:2015-02-03 08:15:03

标签: javascript php jquery forms

这是我添加的验证码工作中的基本注册模块

<form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" class="form-register" role="form" id="register-form">
                    <div>
                        <input name="name" id="name" type="text" class="form-control" placeholder="User name"> 
                        <span class="help-block"></span>
                    </div>

                    <div>
                        <input name="email" id="email" type="email" class="form-control" placeholder="Email address" > 
                        <span class="help-block"></span>
                    </div>
                    <div>
                        <input name="password" id="password" type="password" class="form-control" placeholder="Password"> 
                        <span class="help-block"></span>
                    </div>
                    <div>
                        <input name="confirm_password" id="confirm_password" type="password" class="form-control" placeholder="Confirm Password"> 
                        <span class="help-block"></span>
                    </div>
       <div>
                    <td id="imgparent">
    <div id="imgdiv">
    <img id="img" src="captcha.php">
    </div>
    <img id="reload" src="images/reload.png">

    <input id="captcha1" name="captcha" type="text" class="form-control" placeholder="Enter captcha">
    </td>
    </tr>
            <span class="help-block"></span>
                    </div> 
                    <button class="btn btn-block bt-login" id="button" type="submit">Sign Up</button>

                    <h4 class="text-center login-txt-center">Alternatively, you can log in using:</h4>

                    <a class="btn btn-default facebook_rnd" href="login.php?type=facebook"> <i class="fa fa-facebook modal-icons-rnd"></i> </a>  
                    <a class="btn btn-default google_rnd" href="login.php?type=google"> <i class="fa fa-google-plus modal-icons-rnd"></i> </a>  

                </form>

是register.js

$(document).ready(function(){

    $("#register-form").validate({
        submitHandler : function(e) {
            $(form).submit();
        },
        rules : {
            name : {
                required : true
            },
            email : {
                required : true,
                email: true,
                remote: {
                    url: "check-email.php",
                    type: "post",
                    data: {
                        email: function() {
                            return $( "#email" ).val();
                        }
                    }
                }
            },
            password : {
                required : true
            },
            confirm_password : {
                required : true,
                equalTo: "#password"
            }
        },
        messages : {
            name : {
                required : "Please enter name"
            },
            email : {
                required : "Please enter email",
                remote : "Email already exists"
            },
            password : {
                required : "Please enter password"
            },
            confirm_password : {
                required : "Please enter confirm password",
                equalTo: "Password and confirm password doesn't match"
            }
        },
        errorPlacement : function(error, element) {
            $(element).closest('div').find('.help-block').html(error.html());
        },
        highlight : function(element) {
            $(element).closest('div').removeClass('has-success').addClass('has-error');
        },
        unhighlight: function(element, errorClass, validClass) {
             $(element).closest('div').removeClass('has-error').addClass('has-success');
             $(element).closest('div').find('.help-block').html('');
        }
    });


});

适用于CAPTCHA js

// JavaScript Document

$(document).ready(function() {
// Change CAPTCHA on each click or on refreshing page.
$("#reload").click(function() {
$("#img").remove();
$('<img id="img" src="captcha.php" />').appendTo("#imgdiv");
});
// Validation Function
$('#button').click(function() {
var name = $("#username1").val();
var email = $("#email1").val();
var captcha = $("#captcha1").val();
if (name == '' || email == '' || captcha == '') {

} else {
// Validating CAPTCHA with user input text.
var dataString = 'captcha=' + captcha;
$.ajax({
type: "POST",
url: "verify.php",
data: dataString,
success: function(html) {

      if ($.trim(captcha) == '2') {
                        alert('Entered code is wrong');
                        reloadCaptcha();
                        return false;
                    }
                    validated = true;
                    $("#button").submit();

alert(html);
}
});
}
});
});

这里所有验证工作正常但如果CAPTCHA错了那么它也提交了他的原因吗?&gt;&gt;

CAPTCHA 是什么时候停止返回表格?

1 个答案:

答案 0 :(得分:1)

你在这里做的事情绝不是你想要用Captcha做的事情。

Captcha存在的原因是为了防止恶意表单提交,这意味着如果没有有效的Captcha,您不应该能够向服务器提交任何数据。但是,您正在做的是验证Javascript中的Captcha,然后提交表单。

没有什么可以阻止某人手动调用$(&#39;#button&#39;)。submit()将他们喜欢的任何数据推送到服务器。 Captcha基本没用;它就像一扇没有围墙的门。

您需要重新实施您的Captcha解决方案,以便在您的表单提交的任何地方在服务器端进行验证。首先验证Captcha,然后处理表单提交。

您可以使用以下内容:

session_start();
if($_POST['captcha'] != $_SESSION['<insert Captcha Session key here>']) { /* invalid captcha */ }