zoukankan      html  css  js  c++  java
  • 登录功能之添加验证码(包含切换验证码)

    主要功能,在登录页面上添加验证码,然后如果用户看不清,可以点击“换一张”,切换验证码,如果验证码输入错误,会提示验证码输入错误并无法登录

    首先是LoginServlet

    package cn.itcast.servlet;
    
    import java.io.IOException;
    import javax.servlet.ServletException;
    import javax.servlet.annotation.WebServlet;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    
    /**
     * Servlet implementation class LoginServlet
     */
    @WebServlet("/LoginServlet")
    public class LoginServlet extends HttpServlet {
    
        protected 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("/day11_4/login.jsp").forward(request,response);
                return;
            }
            
            /**
             * 1.获取表单数据
             */
            //处理中文问题
            request.setCharacterEncoding("utf-8");
            //获取
            String username=request.getParameter("username");
            String password = request.getParameter("password");
            //2.校验用户名和密码是否正确
            if(!"itcast".equalsIgnoreCase(username)){//登录成功
                /**
                 * 附加项:把用户名保存到cookie中,发送给客户端浏览器
                 * 当再次打开login.jsp时,login.jsp中会读取request中的cookie,把它显示到用户名文本框中
                 */
                
            }    
        }
        protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
            // TODO Auto-generated method stub
            doGet(request, response);
        }
    
    }

    下面是VerifyCodeServlet(验证码的关键一步)

    package cn.itcast.servlet;
    
    import java.awt.image.BufferedImage;
    import java.io.IOException;
    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 cn.itcast.image.VerifyCode;
    
    @WebServlet("/VerifyCodeServlet")
    public class VerifyCodeServlet extends HttpServlet {
        
        protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        /**
         * 1.生成图片
         * 2.保存图片上的本文到session域中
         * 3.把图片响应给客户端
         */
        VerifyCode vc = new VerifyCode();
        BufferedImage image = vc.getImage();
        request.getSession().setAttribute("session_vcode", vc.getText());//保存图片上的文本到session域
        
        VerifyCode.output(image,response.getOutputStream());
        
        }
        
        protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
            
            doGet(request,response);
        }
    
    }

    再下面是login.jsp

    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>My JSP 'login.jsp' starting page</title>
    
    <meta http-equiv="param" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    
    <link rel="stylesheet" type="text/css" href="style.css">
     
     <script type="text/javascript"></script>
     <script>
     function _change(){
         /**
         1.得到img元素
         2.修改其src为/day11_4/VerifyCodeServlet
         */
         var imgEle = document.getElementById("img");
         imgEle.src="/day11_4/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="/day11_4/LoginServlet" method="post">
    用户名:<input type="text" name="username" value="<%=uname %>" /><br/><%-- --%>
    密码:<input type="password" name="password"/><br/>
    验证码:<input type="text" name="verifyCode" /><br/>
        <img id="img" src=" /day11_4/VerifyCodeServlet"/>
        <a href="javascript:_change()">换一张</a>
        <br/>
        <input type="submit" value="登录"/>
    
    </form>
    
    </body>
    </html>
  • 相关阅读:
    Zookeeper 系列(一)基本概念
    深入浅出 JMS(三)
    深入浅出 JMS(四)
    深入浅出 JMS(三)
    深入浅出 JMS(二)
    深入浅出 JMS(一)
    git 记住用户名和密码
    13 Maven 编写插件
    12 Maven 生成项目站点
    11 Maven 灵活的构建
  • 原文地址:https://www.cnblogs.com/sunstudy/p/13174205.html
Copyright © 2011-2022 走看看