案例需求:访问带有验证码的登录页面login.jsp用户输入用户名,密码以及验证码。如果用户名和密码输入有误,跳转登录页面,提示:用户名或密码错误如果验证码输入有误,跳转登录页面,提示:验证码错误如果全部输入正确,则跳转到主页success.jsp,显示:用户名,欢迎您分析
步骤
文件树展示
1.配置文件和jar包在上个案例均有配置过,需要改的有:User类新增验证码成员变量,数据库增加了一个验证码字段(无用,只是为了UserDao包把查找到的数据值导入到User类不出错)。
2.登陆界面
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>login</title> <script> window.onload = function(){ document.getElementById("img").onclick = function(){ this.src="/CaS/checkCodepic?time="+new Date().getTime(); } } </script> <style> div{ color: red; } </style> </head> <body> <form action="/CaS/loginServlet" method="post"> <table> <tr> <td>用户名</td> <td><input type="text" name="username"></td> </tr> <tr> <td>密码</td> <td><input type="password" name="password"></td> </tr> <tr> <td>验证码</td> <td><input type="text" name="checkCode"></td> </tr> <tr> <td colspan="2"&<strong>本文来源gaodaima#com搞(代@码$网6</strong>gt;<img id="img" src="/CaS/checkCodepic"></td> </tr> <tr> <td colspan="2"><input type="submit" value="登录"></td> </tr> </table> </form> <div><%=request.getAttribute("cc_error") == null ? "" : request.getAttribute("cc_error")%></div> <div><%=request.getAttribute("login_error") == null ? "" : request.getAttribute("login_error") %></div> </body> </html>
3.验证码,画了个验证码,每次都把随机数加入session中以便进行对比
package Test; import javax.imageio.ImageIO; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import java.awt.*; import java.awt.image.BufferedImage; import java.io.IOException; import java.util.Random; @WebServlet("/checkCodepic") public class CheckCodepic extends HttpServlet { @Override protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { int width=100; int height=50; //创建图片对象 BufferedImage image=new BufferedImage(width,height,BufferedImage.TYPE_INT_RGB); //美化图片 //创建画笔 Graphics g = image.getGraphics(); //画笔颜色 g.setColor(Color.pink); //画个矩形,填充为粉红色 g.fillRect(0,0,width,height); //给矩形加边框 g.setColor(Color.blue); g.drawRect(0,0,width-1,height-1); //写字母或数字 g.setColor(Color.green); String str="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789"; Random rd=new Random(); StringBuilder sb=new StringBuilder(); for(int i=1;i<=4;i++){ int index = rd.nextInt(str.length()); char c = str.charAt(index); sb.append(c); g.drawString(c+"",width/5*i,height/2); } String checkCode_session = sb.toString(); //将验证码存入session req.getSession().setAttribute("checkCode_session",checkCode_session); //加干扰线 g.setColor(Color.blue); for(int i=1;i<=10;i++){ int x1 = rd.nextInt(width); int x2 = rd.nextInt(width); int y1 = rd.nextInt(height); int y2 = rd.nextInt(height); g.drawLine(x1,y1,x2,y2); } //输出展示 ImageIO.write(image,"jpg",resp.getOutputStream()); } @Override protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { this.doPost(req,resp); } }