验证码学习：
第一步：写一个JSP页面VerifyCode.jsp：
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"
contentType="image/jpeg"
import="java.awt.*, java.awt.image.*,java.util.*,javax.imageio.*"%>
<%
response.setHeader("Cache-Control", "no-cache");
// 在内存中创建图象
int width = 60, height = 20;
BufferedImage image = new BufferedImage(width, height,
BufferedImage.TYPE_INT_RGB);
//获取画笔
Graphics g = image.getGraphics();
//设定背景色
g.setColor(new Color(200, 200, 200));
g.fillRect(0, 0, width, height);
//取随机产生的验证码(4位数字)
Random rnd = new Random();
int randNum = rnd.nextInt(8999) + 1000;
String randStr = String.valueOf(randNum);
//将验证码存入session
session.setAttribute("rand", randStr);
//将验证码显示到图象中
g.setColor(Color.black);
g.setFont(new Font("", Font.PLAIN, 20));
g.drawString(randStr, 10, 17);
// 随机产生100个干扰点，使图象中的验证码不易被其他程序探测到
for (int i = 0; i < 100; i++) {
int x = rnd.nextInt(width);
int y = rnd.nextInt(height);
g.drawOval(x, y, 1, 1);
} // 输出图象到页面
ImageIO.write(image, "JPEG", response.getOutputStream());
out.clear();
out = pageContext.pushBody();
%>
第二步：登录页面加上div块：
<div>
<div>验证码：
<input id="captcha" class="text w100" type="text" name="captcha" maxlength="4" placeholder="输入验证码" autocomplete="off"/>
</div>
<div style="margin-left: 60px;">
<img name="imgValidate" src="VerifyCode.jsp" onclick="refresh()">
<a href="" onclick="refresh()">看不清，换一张</a>
</div>
</div>
第三步：登录页面加上JS，使得点击验证码时能随机换一个：
function refresh(){
login_main.imgValidate.src = "VerifyCode.jsp";
}
第四步：验证：
<script type="text/javascript" src="${ctx}/js/jquery-1.3.js"></script>
<script type="text/javascript" src="${ctx}/js/jquery.validate.js"></script>
<script type="text/javascript">
$(function(){
$("#login_main").validate({
//debug:true,
onkeyup:true,//当丢失焦点的时候才触发验证请求
//success:'ok',//成功的样式
errorPlacement:function(error,element){ //定义错误消息存放的位置
var error_item = element.parent('div');
error_item.append(error);
},
rules:{
username:{
required:true
},
password:{
required:true
},
captcha:{
required:true,
remote:{ //远程验证
url:'${ctx}/ajax.action',
type:"post"//设置成post则不会调用缓存
}
}
},
messages: {
username:{
required:'<font color="red">用户名不能为空</font>'
},
password:{
required:'<font color="red">密码不能为空</font>'
},
captcha:{
required:'<font color="red">验证码不能为空</font>',
remote:'<font color="red">验证码不正确</font>'
}
}
});
});
</script>
第五步：写controller
/**
* 登录
*/
@RequestMapping("/user/login2.action")
public String login2(String username,String password,HttpServletRequest request){
User user=this.userService.getName(username);
HttpSession session = request.getSession();
if(user!=null&&user.getPassword().equals(password)){
session.setAttribute("user", user.getUsername());
session.setAttribute("msg","账号密码正确！");
return "/home/fmain.jsp";
}else{
session.setAttribute("msg","<font color='red'>账号或者密码错误！</font>");
return "/index.jsp";
}
}
/**
* 验证码ajax验证
*/
@RequestMapping("/ajax.action")
public void ajax(HttpServletRequest request, HttpServletResponse response) throws IOException {
//得到提交的验证码
String captcha = request.getParameter("captcha");
//获取session中的验证码
HttpSession session = request.getSession();
String randStr = (String)session.getAttribute("rand");
response.setCharacterEncoding("utf-8");
PrintWriter out = response.getWriter();
if(captcha.equals(randStr)){
out.print(true);
}else{
out.print(false);
}
out.flush();
}