二、java-常用java验证码

3/8/2017来源:ASP.NET技巧人气:1988

二、java-常用java验证码

本节常用讲java验证码的使用

使用ValidateCode.java的工具类进行验证码的生成

验证码生成源码

public class ValidateCode {
	// 图片的宽度。
	PRivate int width = 120;
	// 图片的高度。
	private int height = 40;
	// 验证码字符个数
	private int codeCount = 4;
	// 验证码干扰线数
	private int lineCount = 20;
	// 验证码
	private String code = null;
	// 验证码图片Buffer
	private BufferedImage buffImg=null;

	private char[] codeSequence = { 'A', 'B', 'C', 'D', 'E', 'F', 'H', 'J',
			'K', 'M', 'N',  'P', 'R', 'S', 'T', 'U', 'V', 'W',
			'X', 'Y', '2', '3', '4', '5', '6', '7', '8' };

	public  ValidateCode() {
		this.createCode();
	}

	/**
	 * 
	 * @param width 图片宽
	 * @param height 图片高
	 */
	public  ValidateCode(int width,int height) {
		this.width=width;
		this.height=height;
		this.createCode();
	}
	/**
	 * 
	 * @param width 图片宽
	 * @param height 图片高
	 * @param codeCount 字符个数
	 * @param lineCount 干扰线条数
	 */
	public  ValidateCode(int width,int height,int codeCount,int lineCount) {
		this.width=width;
		this.height=height;
		this.codeCount=codeCount;
		this.lineCount=lineCount;
		this.createCode();
	}
	
	public void createCode() {
		int x = 0,fontHeight=0,codeY=0;
		int red = 0, green = 0, blue = 0;
		
		x = width / (codeCount +2);//每个字符的宽度
		fontHeight = height - 2;//字体的高度
		codeY = height - 4;
		
		// 图像buffer
		buffImg = new BufferedImage(width, height,BufferedImage.TYPE_INT_RGB);
		Graphics2D g = buffImg.createGraphics();
		// 生成随机数
		Random random = new Random();
		// 将图像填充为白色
		g.setColor(Color.WHITE);
		g.fillRect(0, 0, width, height);
		// 创建字体
		ImgFontByte imgFont=new ImgFontByte();
		Font font =imgFont.getFont(fontHeight);
		g.setFont(font);
		
		for (int i = 0; i < lineCount; i++) {
			int xs = random.nextInt(width);
			int ys = random.nextInt(height);
			int xe = xs+random.nextInt(width/8);
			int ye = ys+random.nextInt(height/8);
			red = random.nextInt(255);
			green = random.nextInt(255);
			blue = random.nextInt(255);
			g.setColor(new Color(red, green, blue));
			g.drawLine(xs, ys, xe, ye);
		}
		
		// randomCode记录随机产生的验证码
		StringBuffer randomCode = new StringBuffer();
		// 随机产生codeCount个字符的验证码。
		for (int i = 0; i < codeCount; i++) {
			String strRand = String.valueOf(codeSequence[random.nextInt(codeSequence.length)]);
			// 产生随机的颜色值,让输出的每个字符的颜色值都将不同。
			red = random.nextInt(255);
			green = random.nextInt(255);
			blue = random.nextInt(255);
			g.setColor(new Color(red, green, blue));
			g.drawString(strRand, (i + 1) * x, codeY);
			// 将产生的四个随机数组合在一起。
			randomCode.append(strRand);
		}
		// 将四位数字的验证码保存到session中。
		code=randomCode.toString();		
	}
	
	public void write(String path) throws IOException {
		OutputStream sos = new FileOutputStream(path);
			this.write(sos);
	}
	
	public void write(OutputStream sos) throws IOException {
			ImageIO.write(buffImg, "png", sos);
			sos.close();
	}
	public BufferedImage getBuffImg() {
		return buffImg;
	}
	
	public String getCode() {
		return code;
	}
}
我后端采用的ssm框架

所以我们写一个共用的controller类在其中写个验证码获取的接口好让前端能够获取到验证码

接口:我通过ValidateCode类获取验证码的字符串保存到session中去

/**
	 * 方法描述:验证码
	 *@return
	 * @throws IOException 
	 */
	@RequestMapping("/code")
	public void Code() throws IOException{
		ValidateCode code=new ValidateCode(110, 40, 4, 5);
		request.getSession().setAttribute("code", code.getCode());
		code.write(response.getOutputStream());
	}
验证接口:获取已保存在session中的验证码字符串获取出来与传入的字符串进行比较

	/**
	 * 方法描述:验证正确
	 *@return
	 * @throws IOException 
	 */
	@RequestMapping("/codev")
	@ResponseBody
	public ResResult Codev(String code){
		String c=(String) request.getSession().getAttribute("code");
		if(c.equals(code.toUpperCase())){
			return ResResult.ok(true);
		}else{
			return ResResult.ok(false);
		}
	}

验证码接口效果图:

前端我用的jq validate进行表单验证

前端验证源码:

$("#form-article-add").validate({
					//出错时添加的标签
 					errorElement : "span", 
		rules: {
			name: {
				required: true,
				minlength: 4,
				maxlength: 12,
			},
			passWord: {
				required: true,
				minlength: 6,
				maxlength: 16
			},
			code: {
				required: true,
				remote: {
					type: "post",
					url: "/wwwydl/s/comm/codev",
					data: {code:$("#code").val()},
					dataType: "json",
					dataFilter: function(result, type) {
						var json = eval('(' + result + ')'); 
						if(json.data){
							return true;
						}else{
							return false;
							changeCode();
						}											
					}
				}
			},
		},
		success: function(label) {
			//正确时的样式
			label.text(" ").addClass("success");
		},
		messages: {
			code: {
				required: "输入验证码",
				remote: "验证码错误"
			}
		},
		onkeyup:false,
		focusCleanup:true,
		success:"valid",
		submitHandler:function(form){
			submit();
		}
	});
前端效果图: