验证码开发 (经典方法 全面讲解)

1.使用MAVEN已有工具包

    com.github.penggle
    kaptcha
    2.3.2

-->配置完成pom.xml

2.配置web.xml

Kaptcha
com.google.code.kaptcha.servlet.KaptchaServlet


kaptcha.border
no



kaptcha.textproducer.font.color
red



kaptcha.image.width
135



kaptcha.textproducer.char.string
ACDEFHKPRSTWX345679



kaptcha.image.height
50



kaptcha.textproducer.font.size
43



kaptcha.noise.color
black



kaptcha.textproducer.char.length
4



kaptcha.textproducer.font.names
Arial

Kaptcha
/Kaptcha

3.html页面表达

验证码

οnclick="changeVerifyCode(this)" src="../Kaptcha" />

4.建立js文件 changeVerifyCode(this)

function changeVerifyCode(img){
img.src="../Kaptcha?" + Math.floor(Math.random()*100);

}

var verifyCodeActual = $('#j_captcha').val();
if(!verifyCodeActual){
$.toast('请输入验证码');
return;
}

formData.append('verifyCodeActual',verifyCodeActual);