Java验证码的实现

Love The Way You Lie 2024-04-17 05:47 69阅读 0赞

> 我们以前在浏览网页进行登录操作时，是不是经常预见验证码的验证，当然不是指手机短信上的，这篇文是介绍在网页中，验证码如何绘制，后续的文章会通过小项目来说明如何进行验证。

首先来说一下实现的**步骤**：

1、需要一个界面用来显示，可以使用html，也可以使用jsp;
    2、在servlet文件中绘制;
    3、实例化缓冲区图片对象，指定宽度、高度、类型等;
    4、获取画笔对象(绘图的图形库)，设置颜色和显示的区域等;
    5、绘制验证码--可以使用随机数，循环4次。还可以对随机数的格式进行设置;
    6、绘制干扰线;
    7、输出。

*  页面就简单的进行实现，大家多多包含：

<body>
    	<%
    		Cookie[] cookies = request.getCookies();
    		if(cookies!=null){
    			for(Cookie cookie:cookies){
    				if("username".equals(cookie.getName())){
    					response.sendRedirect("welcome.jsp");
    					return;
    				}
    			}
    		}
    	%>
    	<%
    		/* String msg = (String) request.getSession().getAttribute("msg"); */
    		String msg = (String)request.getAttribute("msg");
    	%>
    	<%=(msg==null)?"":msg%>
    	
    	<h2>欢迎来到登录界面...</h2>
    	<form action="LoginServlet" method="post">
    		UserName:<input type="text" name="username" /><br /> 
    		PassWord:<input type="password" name="password" /><br />
    		VerificationCode:<input type="text" name="code"/>
    		<img src="CheckCodeServlet"/><br/>
    		<input type="checkbox" name="remember"/>记住我<br/>
    		<input type="submit" value="提交" /> 
    		<input type="reset" value="重置" />
    	</form>
    </body>

这里只给出了body中的内容，看了之后相信大家现在知道了为什么使用jsp文件了吧，更方便，既能写前端又能写后台，更好的交互。开头部分的cookie就是为了验证是否记住用户，这个验证码例子用不上。中间的内容是为了**数据回显**，如果我们用户名、密码或者验证码错误时用来显示，用来接收服务器的响应。后面部分就是界面的简单实现了，验证码部分为：

我们先来看看界面情况----这里是输入错误了一次验证码，可以看到在界面实现部分是没有标签来是显示了，也为了防止页面的跳转，再次访问后会消失，使用的是**转发+请求**：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0h1eW1p_size_16_color_FFFFFF_t_70]  
接下来看后台部分：

package com.hym.servlet;
    
    import java.awt.Color;
    import java.awt.Font;
    import java.awt.Graphics;
    import java.awt.image.BufferedImage;
    import java.io.IOException;
    import java.util.Random;
    
    import javax.imageio.ImageIO;
    import javax.servlet.ServletException;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    
    
    public class CheckCodeServlet extends HttpServlet {
    	private static final long serialVersionUID = 1L;
      
        
    	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    		//绘制验证码:
    		
    		//实例化图像缓冲区对象
    		int width=120;
    		int height = 45;
    		BufferedImage image = new BufferedImage(width,height,BufferedImage.TYPE_INT_RGB);
    		//获取画笔对象
    		Graphics graphics = image.getGraphics();
    		//设置颜色
    		graphics.setColor(Color.PINK);
    		//填充区域
    		graphics.fillRect(0, 0, width, height);
    		
    		//绘制验证码
    		Random random = new Random();
    		//设置验证码的颜色和字体
    		graphics.setColor(Color.GREEN);
    		graphics.setFont(new Font("宋体", Font.BOLD, 30));
    
    		for(int i=0;i<4;i++){
    			int code = random.nextInt(10);
    			graphics.drawString(code+"", 15*i+20,25);
    		}
    		//设置干扰线
    		graphics.setColor(Color.WHITE);
    		for(int i=0;i<13;i++){
    			graphics.drawLine(random.nextInt(width), random.nextInt(height), random.nextInt(width), random.nextInt(height));
    		}
    		//输出
    		ImageIO.write(image, "jpg", response.getOutputStream());
    	}
    
    	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    		// TODO Auto-generated method stub
    		doGet(request, response);
    	}
    }

在这里显示的话有一个小细节，我们在网页中用于接收的 img/>标签中的src正式指向我们的servlet类。

<img src="CheckCodeServlet"/>
    public class CheckCodeServlet extends HttpServlet

可以看到当再次访问时，数据回显会消失，并且随机数会刷新。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0h1eW1p_size_16_color_FFFFFF_t_70 1]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0h1eW1p_size_16_color_FFFFFF_t_70]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/11/e8685f8493b648c5bad45127cb6badec.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0h1eW1p_size_16_color_FFFFFF_t_70 1]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/11/1f74e3dd25aa43539c84113e5698f365.png