A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

Java代码实现验证码功能

一、实现验证码功能的目的
在访问登录页面时,为了避免用户使用程序进行恶意登陆,从而造成系统不安全,为了解决恶意登陆,需要生产验证码,让每一次登陆的验证码不一样,进而避免恶意登陆。如图1所示。
1:用户验证码登陆界面
二、具体代码实现1、前端代码修改
修改login.jsp页面,确定验证码图片显示的位置
1 <div class="col-sm-3">
2 <!-- 当前验证码图片位置 -->
3 <img id="img" src="${pageContext.request.contextPath}/checkcodeServlet"/>       
4 </div>
注解:
这里提供的是jsp页面,提交路径是checkcodeServlet。
2、后台Java代码实现
CheckcodeServlet 具体代码实现。
1 import java.awt.Color;
1 import java.awt.Font;
2 import java.awt.Graphics;
3 import java.awt.image.BufferedImage;
4 import java.io.IOException;
5 import java.util.Random;
6 import javax.imageio.ImageIO;
7 import javax.servlet.ServletException;
8 import javax.servlet.http.HttpServlet;
9 import javax.servlet.http.HttpServletRequest;
10 import javax.servlet.http.HttpServletResponse;
11 public class CheckcodeServlet extends HttpServlet {
12         private static final long serialVersionUID = 1L;
13
14         protected void doGet(HttpServletRequest request, HttpServletResponse response)
15                         throws ServletException, IOException {
16                 // gui 生成图片
17                 // 1 高和宽
18                 int height = 30;
19                 int width = 60;
20                 String data = "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789abcdefghijklmnopqrstuvwxyz";
21                 Random random = new Random();
22                 // 2 创建一个图片
23                 BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
24                 // 3 获得画板
25                 Graphics g = image.getGraphics();
26                 // 4 填充一个矩形
27                 // * 设置颜色
28                 g.setColor(Color.BLACK);
29                 g.fillRect(0, 0, width, height);
30                 g.setColor(Color.WHITE);
31                 g.fillRect(1, 1, width - 2, height - 2);
32                 // * 设置字体
33                 g.setFont(new Font("宋体", Font.BOLD | Font.ITALIC, 25));
34                 StringBuilder sb = new StringBuilder();// 获取验证码字符信息
35                 // 5 写随机字
36                 for (int i = 0; i < 4; i++) {
37                         // 设置颜色--随机数
38                         g.setColor(new Color(random.nextInt(255), random.nextInt(255), random.nextInt(255)));
39                         // 获得随机字
40                         int index = random.nextInt(data.length());
41                         String str = data.substring(index, index + 1);
42                         sb.append(str);
43                         // 写入
44                         g.drawString(str, width / 6 * (i + 1), 20);
45                 }
46                 // 验证码保存到session对象中
47                 request.getSession().setAttribute("checkcode", sb.toString());
48                 // 6 干扰线
49                 for (int i = 0; i < 3; i++) {
50                         // 设置颜色--随机数
51                         g.setColor(new Color(random.nextInt(255), random.nextInt(255), random.nextInt(255)));
52                         // 随机绘制先
53                         g.drawLine(random.nextInt(width), random.nextInt(height), random.nextInt(width), random.nextInt(height));
54                         // 随机点
55                         g.drawOval(random.nextInt(width), random.nextInt(height), 2, 2);
56                 }
57
58                 // end 将图片响应给浏览器
59                 ImageIO.write(image, "jpg", response.getOutputStream());
60         }
61         protected void doPost(HttpServletRequest request, HttpServletResponse response)
62                         throws ServletException, IOException {
63                 doGet(request, response);
64         }
65 }
3、配置文件的修改
编写web.xml文件
1  <servlet>
2     <servlet-name>CheckcodeServlet</servlet-name>
3     <servlet-class>cn.itcast.web.CheckcodeServlet</servlet-class>
4   </servlet>
5   <servlet-mapping>
6     <servlet-name>CheckcodeServlet</servlet-name>
7     <url-pattern>/checkcodeServlet</url-pattern>
8   </servlet-mapping>
二、点击验证码实现切换功能
如图2所示,点击验证码图片或者点击文字“换一张”,可以更改验证码内容。
2:点击更换验证码图片
代码实现,点击图片或文件,都可以更换验证码图片。
5 <div class="col-sm-3">
6 <!-- 当前验证码图片位置 -->
7 <img id="img" src="${pageContext.request.contextPath}/checkcodeServlet"/>       
8 </div>
9 <script type="text/javascript">
10         function changeImg(){
11                 document.getElementById('img').src="${pageContext.request.contextPath}/checkcodeServlet?e="+new Date().getTime();
12         }
13 </script>
注解:
这里提供的是jsp页面,提交路径是checkcodeServlet。

6 个回复

倒序浏览
回复 使用道具 举报
回复 使用道具 举报
奈斯,很赞
回复 使用道具 举报
回复 使用道具 举报
666666666666666666666666666666666
回复 使用道具 举报
怎么验证输入的验证码是否正确呢
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 加入黑马