java后端验证验证码，防绕过

java后端验证验证码

1.前端

<form action="<%=contextPath %>/target/targetindex" id="form_submit" method="post">
           <input type="password" class="input input-big" name="password" id="password" placeholder="登录密码"  />
           <input type="text" class="input input-big" name="code" id="code_input" placeholder="填写右侧的验证码" />
           <input type="text" class="input input-big" name="code" id="code_input" placeholder="填写下图中验证码" />
		   <img class="verifyCode" src="<%=contextPath%>/getVerifyCode" />
           <input type="button" id="submit_button" class="button button-block bg-main text-big input-big" value="登录"> </form>    

$(".verifyCode").click(function(){
		 var timestamp = Date.parse(new Date());
		//加时间戳，防止浏览器利用缓存
		 var path = "<%=contextPath%>/getVerifyCode?"+timestamp; 
		   $('.verifyCode').attr("src",path);       
	});
	
//提交表单：
	$.ajax({
				type:"POST", 
				url:"<%=contextPath%>/user/login",
				data:{"username":username,"password":password,"code":code},
				dataType:"json",
				success:function(data){
					if(data.data == true){
						$("#form_submit").submit();
					}else{
						alert(data.msg);
						var timestamp = Date.parse(new Date());
						var path = "<%=contextPath%>/getVerifyCode?"+timestamp; 
						   $('.verifyCode').attr("src",path);    
						$("#password").val("");
					}
				}
			});

2.生成验证码接口

将生成的验证码数值放到session中。

import java.awt.image.BufferedImage;
import java.io.IOException;
import java.io.OutputStream;

import javax.imageio.ImageIO;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.xxjf.domain.VerifyCode;

@Controller
public class VerifyCodeController {
	Log logger = LogFactory.getLog( this .getClass());   
	/* 获取验证码图片*/
	 
    @RequestMapping("/getVerifyCode")
    public void getVerificationCode(HttpServletResponse response,HttpServletRequest request) {
           try {
                   int width=200;
                   int height=69;
                   BufferedImage verifyImg=new BufferedImage(width,height,BufferedImage.TYPE_INT_RGB);
                   //生成对应宽高的初始图片
                   String randomText = VerifyCode.drawRandomText(width,height,verifyImg);
                   //单独的一个类方法，出于代码复用考虑，进行了封装。
                   //功能是生成验证码字符并加上噪点，干扰线，返回值为验证码字符                   
                   request.getSession().setAttribute("verifyCode", randomText);
                   response.setContentType("image/png");//必须设置响应内容类型为图片，否则前台不识别
                   OutputStream os = response.getOutputStream(); //获取文件输出流    
                   ImageIO.write(verifyImg,"png",os);//输出图片流
                   os.flush();
                   os.close();//关闭流
              } catch (IOException e) {
                   this.logger.error(e.getMessage());
                   e.printStackTrace();
              }
    }
}

3.提交表单，后代验证验证码

@ResponseBody
	@RequestMapping("login")
	public Map<String,Object> login(String username,String password,String code,HttpServletRequest request) {
		Map<String,Object> map = new HashMap<String,Object>();
		//对用户名、密码的验证码。省略
		//对验证码的验证
			if(session.getAttribute("verifyCode").toString().equalsIgnoreCase(code)) {
			map.put("data", true);
			return map;
		}
		map.put("data", false);
		map.put("msg", "验证码不正确！");
		return map;
	}