Question

我有一个申请表，我需要使用jquery验证验证码。如果输入的验证码是错误的，那么显示的警告框请再次输入验证码输入的验证码是错误的..我怎么能用jquery做到这一点？请帮我。我是jquery的新手。

以下是代码：

$(function() {
    $("#XISubmit").click(function(){
        event.preventDefault()
        val=$('#vercode').val()
        $.ajax({
            type:"post",
            url:"verify-captcha.php",
            data:{'code':val},
            success:function(data){
               if(data=='false'){
                    alert('Re-enter Captcha, You Entered wrong captcha code')
                    $("#cap").html("<img  src='captcha_image.php'>"); }
                else{  
                     document.getElementById("XIForm").submit();
                }
            }

        });    
    });
});

            document.getElementById("XIForm").submit();

                });
Html page :

<label>Security Validation</label>    

<span><img   src="captcha.php"></span><input type="text" name="vercode" id="vercode" size="10" style="margin-top: -1px; float: left; width: 115px; margin-right: 12px;"></li><div id="msg"></div>
captcha.php

<?php
session_start();
$ranStr = md5(microtime());
$ranStr = substr($ranStr, 0, 6);
$_SESSION['cap_code'] = $ranStr;
$newImage = imagecreatefromjpeg("cap_bg.jpg");
$txtColor = imagecolorallocate($newImage, 0, 0, 0);
imagestring($newImage, 5, 5, 5, $ranStr, $txtColor);
header("Content-type: image/jpeg");
imagejpeg($newImage);
?>
verify-captcha.php

<?php
session_start(); 
if ($_POST["code"] != $_SESSION["cap_code"] || $_SESSION["cap_code"]=='')  { 
 echo 'false';
}else{
echo 'true';}

Answer 1

从https://code.google.com/p/recaptcha4j/downloads/list

下载recaptcha.jar

<%@ page import="net.tanesha.recaptcha.ReCaptcha" %>
<%@ page import="net.tanesha.recaptcha.ReCaptchaFactory" %>

<form action="." method="post">
    <div class="loginbox">
            <c:set var="PUBLIC_KEY" scope="page" value="${requestScope.properties.get('PUBLIC_KEY')}" />
            <c:set var="PRIVATE_KEY" scope="page" value="${requestScope.properties.get('PRIVATE_KEY')}" />

            <% ReCaptcha c = ReCaptchaFactory.newSecureReCaptcha((String)pageContext.getAttribute("PUBLIC_KEY"), (String)pageContext.getAttribute("PRIVATE_KEY"), false);
                out.print(c.createRecaptchaHtml("errorMessage","blackglass", 2)); %>                        
            <button type="submit">Submit</button>           
    </div>
</form>

将PUBLIC和PRIVATE密钥保存在* .properties文件中（如果没有创建）并使用$ {requestScope.properties.get（＆＃39; PUBLIC_KEY＆＃39;）}来获取PUBLIC和PRIVATE KEY。 / p>

现在ajax调用以下2个参数。并在后端验证recaptchaResponseField和recaptchaChallengeField。

recaptchaResponseField = $（＆＃34;输入[名称= recaptcha_response_field]＆＃34）VAL（）; recaptchaChallengeField = $（＆＃34;输入[名称= recaptcha_challenge_field]＆＃34）。VAL（）;

var ajax=$.ajax({
            url: API.get_api_url('your_auth_url'),
            data: {recaptchaResponseField:recaptchaResponseField,recaptchaChallengeField:recaptchaChallengeField},
            type: 'POST',
            success: function(data, status, xhr){
                if(data){
                    if(data.statusCode == 0){
                        log("if successfully authenticated.. send to home page");
                    }
                }
            }
        });

在java（后端）。使用以下验证重新验证码

public boolean isValidCapctha(HttpServletRequest request, String recaptchaResponseField, String recaptchaChallengeField) {  
        String remoteAddr = request.getRemoteAddr();
        ReCaptchaImpl reCaptcha = new ReCaptchaImpl();
        reCaptcha.setPrivateKey(properties.getProperty("PRIVATE_KEY"));
        ReCaptchaResponse reCaptchaResponse = reCaptcha.checkAnswer(remoteAddr, recaptchaChallengeField, recaptchaResponseField);
        return reCaptchaResponse.isValid();     
    }

使用jquery验证验证码

1 个答案: