javawebday30(验证码在客户端用当前时间来请求下一张图片 VerifyCode代码)[通俗易懂]

大家好，又见面了，我是你们的朋友全栈君。

这里写图片描述
页面运行servlet 500错误信息 tomcat报错卡住可能是因为映射错误即 web.xml中的问题
405 post改成get方法
如果出现不支持post提交可能需要修改表单中的提交方式
VerifyCode.java

public class VerifyCode {
    private int w = 70;
    private int h = 35;
    private Random r = new Random();
    //{"宋体","华文楷体","黑体","微软黑体","楷体_GB2312"}
    private String [] fontNames = {
  
  "宋体","华文楷体","黑体","微软黑体","楷体_GB2312"};
    //可选字符
    private String codes = "23456789abcdefghijkmnopqrstuvwxyzABCDEFGHJKMNOPQRSTUVWXYZ";
    //背景色
    private Color bgColor = new Color(255,255,255);
    //验证码上的文本
    private String text;
    //生成随机的颜色
    private Color randomColor(){
        int red = r.nextInt(150);
        int green = r.nextInt(150);//不能和白色过于靠近
        int blue  = r.nextInt(150);
        return new Color(red,green,blue);
    }
    //生成随机的字体
    private Font  randomFont(){
        int index = r.nextInt(fontNames.length);
        String fontName = fontNames[index];//生成随机的字体名称
        int style = r.nextInt(4);//生成随机的样式 0(无样式) 1（粗体） 2（斜体）3（粗体加斜体）
        int size = r.nextInt(5)+24;//生成随机字号
        return new Font(fontName,style,size);
    }
    //画干扰线
    private void drawLine(BufferedImage image){
        int num = 3;//一共画3条
        Graphics2D g2 = (Graphics2D) image.getGraphics();
        for(int i=0;i<num;i++){
  
  //生成2个点的坐标，即4个值
            int x1 = r.nextInt(w);
            int y1 = r.nextInt(h);
            int x2 = r.nextInt(w);
            int y2 = r.nextInt(h);
            g2.setStroke(new BasicStroke(1.5F));
            g2.setColor(Color.blue);//干扰线是蓝色的
            g2.drawLine(x1, y1, x2, y2);//画线
        }       
    }
    //随机生成字符
    private char randomChar(){
        int index = r.nextInt(codes.length());
        return codes.charAt(index);
    }
    //创建BufferedImage
    private BufferedImage createImage(){
        BufferedImage image = new BufferedImage(w,h,BufferedImage.TYPE_INT_RGB);
        Graphics2D g2 = (Graphics2D) image.getGraphics();
        g2.setColor(this.bgColor);
        g2.fillRect(0, 0, w, h);
        return image;
    }
    //调用这个方法得到验证码
    public BufferedImage getImage(){
        BufferedImage image = createImage();//创建图片缓冲区
        Graphics2D g2 = (Graphics2D) image.getGraphics();//得到绘制环境
        StringBuilder sb = new StringBuilder();//用来装载生成的验证码文本
        //向图片中画四个字符
        for(int i =0;i<4;i++){
  
  //循环四次，每次生成一个字符
            String s = randomChar()+"";//随机生成一个字母
            sb.append(s);//把字母添加到sb中
            float x = i*1.0F*w/4;//设置当前字符的x轴坐标
            g2.setFont(randomFont());//设置随机字体
            g2.setColor(randomColor());//设置随机颜色
            g2.drawString(s, x, h-5);//画图
        }
        this.text =sb.toString();//把生成的字符串赋给this.text
        drawLine(image);//添加干扰线
        return image;
    }

    //返回验证码图片上的文本
    public String getText(){
        return text;
    }

    //保存图片到指定的输出流
    public static void output(BufferedImage image,OutputStream out) throws IOException{
        ImageIO.write(image, "JPEG", out);
    }
}

VerifyCodeServlet.java

public class VerifyCodeServlet extends HttpServlet { 
   


    public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        /* * 1、生成图片 * 2、保存图片上的文本到session域中 * 3、把图片响应给客户端 */
        VerifyCode vc = new VerifyCode();
        BufferedImage bi = vc.getImage();
        request.getSession().setAttribute("session_vcode", vc.getText());//保存图片上的文本到session域

        VerifyCode.output(bi, response.getOutputStream());
    }

}

    <script type="text/javascript"> function _change(){ 
     /* 1、得到img元素 2、修改其src为/day28_01/VerifyCodeServlet */ var imgEle = document.getElementById("img"); //添加时间 保证每次点击不同 可以让浏览器认为是不同的请求 然后重新发送图片 防止浏览器认为已经缓存而不发 imgEle.src="/day28_01/VerifyCodeServlet?a="+new Date().getTime(); } </script>
  </head>

  <body>
   <%--本页面提供登录表单 还要显示错误信息 --%>
   <h1>登录</h1>
   <% /* 读取名为uname的cookie 如果为空显示:"" 如果不为空显示：cookie的值 */ String uname=""; Cookie[] cs = request.getCookies();//获取请求中所有的cookie if(cs!=null){//如果存在cookie for(Cookie c:cs){//循环遍历所有的cookie if("uname".equals(c.getName())){//查找名为uname的cookie uname = c.getValue();//获取这个cookie的值，给uname这个变量 } } } %>
   <% String message =""; String msg = (String)request.getAttribute("msg");//获取request域中的名为msg的属性 if(msg!=null){ message = msg; } %>
   <font color = "red"><b><%=message %></b></font>
   <form action="/day28_01/LoginServlet" method="get">
   <%--把cookie中的用户名显示到用户名文本框中 --%>
    用户名:<input type="text" name="username" value="<%=uname %>"/><br/>
    密    码:<input type="password" name="password" /><br/>
    验证码:<input type="text" name ="verifyCode" size="3"/>
            <img id="img" src="/day28_01/VerifyCodeServlet"/>
          <a href="javascript:_change()">换一张</a>
    <br/>
    <input type="submit" value="登录"/>
   </form>
  </body>

LoginServlet.java

public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        /* * 校验验证码 * 1、从session中获取正确的验证码 * 2、从表单中获取用户填写的验证码 * 3、进行比较 * 4、如果相同，向下运行，否则保存错误信息到request域，转发到login.jsp */
        String sessionCode = (String) request.getSession().getAttribute("session_vcode");
        String paramCode = request.getParameter("verifyCode");
        if(!paramCode.equalsIgnoreCase(sessionCode)){
            request.setAttribute("msg", "验证码错误");
            request.getRequestDispatcher("/session2/login.jsp").forward(request, response);
            return;//不加return还要向下执行
        }
        /* * 1/获取表单数据 */
        //处理中文问题
        request.setCharacterEncoding("utf-8");
        //获取
        String username = request.getParameter("username");
        String password = request.getParameter("password");
        /* * 2、校验用户名和密码是否正确 */
        if("aa".equalsIgnoreCase(username)){
  
  //登录成功
            /* * 把用户名保存到cookie中，发送给客户端浏览器 * 当再次打开login.jsp时login.jsp中会读取request中的cookie，把他显示到用户名文本框中 */
            Cookie cookie = new Cookie("uname", username);//创建Cookie
            cookie.setMaxAge(60*60*24);//设置cookie命长为1天
            response.addCookie(cookie);

            /* * 3、如果成功 * 保存用户信息到session中 * 重定向到succ1.jsp */
            HttpSession session = request.getSession();//获取session
            session.setAttribute("username", username);//向session域中保存用户名
            response.sendRedirect("/day28_01/session2/succ1.jsp");//重定向带项目名 转发不用
        }else{
  
  //登录失败
            /* * 4、如果失败 * 保存错误信息学到request域中 * 转发到login.jsp 如果重定向 域中信息获取不到 相当于2个请求了 */
            request.setAttribute("msg", "用户名或密码错误");
            RequestDispatcher rd = request.getRequestDispatcher("/session2/login.jsp");//等到转发器
            rd.forward(request,response);//转发
        }