登录验证码的实现

jsp页面

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@page import="org.apache.commons.lang.StringUtils"%>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <link rel="stylesheet" href="scripts/login/css/supersized.css">
    <link rel="stylesheet" href="scripts/login/css/bootstrap.min.css" >
    <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
    <script src="js/html5.js"></script>
　　<![endif]-->
　　<script src="scripts/login/js/jquery-1.8.2.min.js"></script>
　　<script type="text/javascript" src="scripts/login/js/jquery.form.js"></script>
　　<script type="text/javascript" src="scripts/login/js/supersized.3.2.7.min.js"></script>
　　<script type="text/javascript" src="scripts/login/js/supersized-init.js"></script>
　　<script type="text/javascript" src="scripts/login/js/tooltips.js"></script>
　　<script type="text/javascript" src="scripts/login/js/login.js"></script>
　　<!--<script type="text/javascript" src="scripts/login/js/scripts.js"></script>-->
　　<script type="text/javascript">
        if(self!=top){top.location=self.location;}
        // 重载验证码
        function reloadVerifyCode(){
            var timenow = new Date().getTime();                        
            document.getElementById("captcha_img").src="<%=request.getContextPath()%>/servlet/validateCode?d="+timenow;
        }
            
　　</script>
　　<style type="text/css">
　　　　.main_box {
    　　　　position: absolute; top:50%; left:50%; margin-top:-260px; margin-left: -300px; padding: 30px; width:600px; height:460px;
    　　　　background:url(scripts/login/images/1.png);
    　　　　border-radius: 10px;
　　　　}
　　　　.main_box .setting {position: absolute; top: 5px; right: 10px; width: 10px; height: 10px;}
　　　　.main_box .setting a {color: #FF6600;}
　　　　.main_box .setting a:hover {color: #555;}
　　　　.login_logo {margin-bottom: 20px; height: 45px; text-align: center;}
　　　　.login_logo img {height: 45px;}
　　　　.login_msg {text-align: center; font-size: 16px;}
　　　　.login_form {padding-top: 20px; font-size: 16px;}
　　　　.login_box .form-control {display: inline-block; *display: inline; zoom: 1; width: auto; font-size: 18px;}
　　　　.login_box .form-control.x319 {width: 319px;}
　　　　.login_box .form-control.x164 {width: 164px;}
　　　　.login_box .form-group {margin-bottom: 20px;}
　　　　.login_box .form-group label.t {width: 120px; text-align: right; cursor: pointer;}
　　　　.login_box .form-group.space {padding-top: 15px; border-top: 1px #FFF dotted;}
　　　　.login_box .form-group img {margin-top: 1px; height: 32px; vertical-align: top;}
　　　　.login_box .m {cursor: pointer;}
　　　　.bottom {text-align: center; font-size: 12px;}
　　</style>
</head>
<body>
    <div class="page-container">
        <div class="main_box">
            <div class="login_box">
                <div class="login_logo">
                    <img src="scripts/login/images/logo.png" >
                </div>
            
                <div class="login_form">
                    <form id="login_form" method="post" action="<%=request.getContextPath() %>/loginpro.action">
                        <div class="form-group">
                            <label for="j_username" class="t">用　户：</label> 
                            <input id="username" value="" name="username" type="text" class="form-control x319 in" autocomplete="off">
                        </div>
                        <div class="form-group">
                            <label for="j_password" class="t">密　码：</label> 
                            <input id="password" value="" name="password" type="password" class="password form-control x319 in">
                        </div>
                        <div class="form-group">
                            <label for="j_captcha" class="t">验证码：</label>
                            <input id="captcha" name="captcha" type="text" class="form-control x164 in">
                            <img name="captcha_img" id="captcha_img" alt="点击更换" title="点击更换" src="<%=request.getContextPath()%>/servlet/validateCode" onclick="javascript:reloadVerifyCode();" class="m">
                        </div>
    
                        <div class="form-group space">
                            <label class="t"></label>　
                            <button type="button"  id="submit_btn" 
                            class="btn btn-primary btn-lg"> 登 录  </button>
                            <input type="reset" value=" 重 置 " class=" btn-default btn-lg">
                        </div>
                    </form>
                </div>
            </div>
            
            <div class="bottom">
                <%String msg=(String)request.getAttribute("errormsg")==null?"": (String)request.getAttribute("errormsg");%>
                <font style="color: blue; font-size: 12px;"><%= msg%></font>
                <%
                String msg2=(String)session.getAttribute("timeouterrormsg")==null?"": (String)session.getAttribute("timeouterrormsg");
                if(StringUtils.isEmpty(msg)){
                %>
                <font style="color: blue; font-size: 12px;"><%= msg2%></font>
                <%} %>
            </div>
            
        </div>
    </div>
    
    <div style="text-align:center;">
    <p></p>
    </div>
    </body>
</html>

Java action处理登录方法

    /**
     * 登录
     * 
     * @return
     */
    @SuppressWarnings("unchecked")
    public String login() {
        username = sRequest.getParameter("username");
        password = sRequest.getParameter("password");
        String checkcode = sRequest.getParameter("captcha");
        if (!checkcode.toLowerCase().equals(
                ((String) session.get("piccode")).toLowerCase())) {
            request.put("errormsg", "对不起，验证码错误，登录失败!");
            return ERROR;
        }
        User user = null;
        try {
            user = userService.findUserByNamePsd(username, password);
        } catch (Exception e) {
            user = null;
            e.printStackTrace();
        }
        if (user != null) {// login success
            if (user.getEnable().intValue() == 0) {
                request.put("errormsg", "对不起，该用户当前已经被禁用，请联系管理员！");
                return ERROR;
            }
            session.put("user", user);
            List<Module> moduleList = moduleService.getModuleList();
            if (moduleList != null && moduleList.size() > 0) {
                session.put("modules", moduleList);
            }
            // 登陆用户拥有的角色
            List<Role> initRoles = roleService.findRolesByUserId(user.getId());
            if (initRoles == null || initRoles.size() < 1) {
                request.put("errormsg", "对不起，您还没有授权，请联系管理员！");
                return ERROR;
            }
            // 获得可以访问的模块列表
            List<Module> initModulesList = new ArrayList<Module>();
            for (Role role : initRoles) {
                List<Module> temp = moduleService.findModulesByRoleId(role
                        .getId());
                if (temp != null && temp.size() > 0) {
                    initModulesList.addAll(temp);
                }
            }
            List<Module> result = null;
            if (initModulesList != null && initModulesList.size() > 0) {
                // 补充完整模块对象并放到session中
                result = new ArrayList<Module>();
                for (Module m : initModulesList) {
                    for (Module mm : moduleList) {
                        if (m.getId().intValue() == mm.getId().intValue()) {
                            result.add(mm);
                        }
                    }
                }
                session.put("result", result);
                Log log = new Log();
                log.setUserId(user.getId());
                log.setOprate("登录系统");
                log.setIp(sRequest.getRemoteAddr());
                logService.addLog(log);
            } else {
                request.put("errormsg", "对不起，您还没有授权，请联系管理员！");
                return ERROR;
            }
            return SUCCESS;
        } else {// login failed
            request.put("errormsg", "对不起，用户名或密码不正确，登录失败！");
            return ERROR;
        }
    }

java 验证码servlet

package com.xxxxx.util;

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 ValidateCode extends HttpServlet {
    private static final long serialVersionUID = 3110081721876882107L;

    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        this.doPost(request, response);
    }

    // 生成数字和字母的验证码
    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        BufferedImage img = new BufferedImage(68, 22,
                BufferedImage.TYPE_3BYTE_BGR);// TYPE_INT_RGB
        // 得到该图片的绘图对象
        Graphics g = img.getGraphics();
        Random r = new Random();
        Color c = new Color(200, 150, 255);
        g.setColor(c);
        // 填充整个图片的颜色
        g.fillRect(0, 0, 68, 22);
        // 向图片中输出数字和字母
        StringBuffer sb = new StringBuffer();
        char[] ch = "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789".toCharArray();
        int index, len = ch.length;
        for (int i = 0; i < 4; i++) {
            index = r.nextInt(len);
            g
                    .setColor(new Color(r.nextInt(88), r.nextInt(188), r
                            .nextInt(255)));
            g.setFont(new Font("Arial", Font.BOLD | Font.ITALIC, 22));// 输出的字体和大小
            g.drawString("" + ch[index], (i * 15) + 3, 18);// 写什么数字，在图片的什么位置画
            sb.append(ch[index]);
        }
        request.getSession().setAttribute("piccode", sb.toString());
        ImageIO.write(img, "JPG", response.getOutputStream());
    }
}

web.xml

<!-- 验证码begin -->
<servlet>
    <servlet-name>validateCode</servlet-name>
    <servlet-class>com.xxxxx.util.ValidateCode</servlet-class>
</servlet>
<servlet-mapping>
    <servlet-name>validateCode</servlet-name>
    <url-pattern>/servlet/validateCode</url-pattern>
</servlet-mapping>
<!-- 验证码end -->
【推广】 免费学中医，健康全家人
原文地址：https://www.cnblogs.com/henuyuxiang/p/6813525.html