Servlet生成JSP页面验证码

绝地灬酷狼 2022-08-17 14:19 268阅读 0赞

1、JSP页面调用后台的Servlet页面来生成验证码

JSP页面部分代码，点击验证码图片能够刷新验证码：

function Refresh()
            {
            	document.getElementById("ImgCode").src="servlet/ImgCodeServlet?now="+new Date();
            }
    
    
     <td>
                                    <img id="ImgCode" title="点击更换验证码" style="width:80px;height: 27px;cursor:pointer;padding-left: 9px;padding-top: 0px" οnclick="Refresh()" alt="点击更换验证码" src="servlet/ImgCodeServlet"></img>
                                </td>

Servlet代码：

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;
    import javax.servlet.http.HttpSession;
    
    public class ImgCodeServlet extends HttpServlet
    {
        /**
         * 注释内容
         */
        private static final long serialVersionUID = 4596404497597968563L;
        
        /**
         * 设置图形验证码中字符串的字体和大小
         */
        private Font myFont = new Font("Arial Black", Font.PLAIN, 16);
        
        /**
         * <生成随机颜色>
         * <功能详细描述>
         * @param fc
         * @param bc
         * @return
         * @see [类、类#方法、类#成员]
         */
        Color getRandColor(int fc, int bc)
        {
            Random random = new Random();
            if (fc > 255)
            {
                fc = 255;
            }
            if (bc > 255)
            {
                bc = 255;
            }
            int r = fc + random.nextInt(bc - fc);
            int g = fc + random.nextInt(bc - fc);
            int b = fc + random.nextInt(bc - fc);
            return new Color(r, g, b);
        }
        
        @Override
        public void init()
            throws ServletException
        {
            super.init();
        }
        
        @Override
        protected void service(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException
        {
            //阻止生成的页面内容被缓存，保证每次重新生成随机验证码
            response.setHeader("Pragma", "No-cache");
            response.setHeader("Cache-Control", "no-cache");
            response.setDateHeader("Expires", 0);
            response.setContentType("image/jpeg");
            
            //指定生成图形验证码图片的大小
            int width = 80, height = 27;
            //生成一张新图片
            BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
            //在图片中绘制内容
            Graphics g = image.getGraphics();
            Random random = new Random();
            g.setColor(getRandColor(200, 250));
            g.fillRect(1, 1, width - 1, height - 1);
            g.setColor(new Color(102, 102, 102));
            g.drawRect(0, 0, width - 1, height - 1);
            g.setFont(myFont);
            
            //随机生成线条，让图片看起来更加杂乱
            g.setColor(getRandColor(160, 200));
            for (int i = 0; i < 155; i++)
            {
                int x = random.nextInt(width - 1);// 起点的x坐标  
                int y = random.nextInt(height - 1);// 起点的y坐标  
                int x1 = random.nextInt(6) + 1;// x轴偏移量  
                int y1 = random.nextInt(12) + 1;// y轴偏移量  
                g.drawLine(x, y, x + x1, y + y1);
            }
            // 随机生成线条，让图片看起来更加杂乱  
            for (int i = 0; i < 70; i++)
            {
                int x = random.nextInt(width - 1);
                int y = random.nextInt(height - 1);
                int x1 = random.nextInt(12) + 1;
                int y1 = random.nextInt(6) + 1;
                g.drawLine(x, y, x - x1, y - y1);
            }
            
            //该变量用来保存随机字符
            String sRand = "";
            for (int i = 0; i < 4; i++)
            {
                String temp = getRandomChar();
                sRand += temp;
                //将系统生成的随机字符添加到图形验证码上
                g.setColor(new Color(20 + random.nextInt(110), 20 + random.nextInt(110), 20 + random.nextInt(110)));
                g.drawString(temp, 15 * i + 10, 15);
            }
            HttpSession session = request.getSession(true);
            session.setAttribute("rand", sRand);
            g.dispose();
            ImageIO.write(image, "JPEG", response.getOutputStream());
        }
        
        /**
         * <生成一个随机字符>
         * <功能详细描述>
         * @return
         * @see [类、类#方法、类#成员]
         */
        private String getRandomChar()
        {
            //将0～2的小数四舍五入生成整数
            int rand = (int)Math.round(Math.random() * 2);
            long itmp = 0;
            char ctmp = '\u0000';
            switch (rand)
            {
            //生成大写字母
                case 1:
                    itmp = Math.round(Math.random() * 25 + 65);
                    ctmp = (char)itmp;
                    return String.valueOf(ctmp);
                    
                    //生成小写字母
                case 2:
                    itmp = Math.round(Math.random() * 25 + 97);
                    ctmp = (char)itmp;
                    return String.valueOf(ctmp);
                    
                    //生成数字
                default:
                    itmp = Math.round(Math.random() * 9);
                    return String.valueOf(itmp);
            }
            
        }
        
    }

Servlet配置：

<servlet>
        <servlet-name>ImgCodeServlet</servlet-name>
        <servlet-class>com.query.ImgCodeServlet</servlet-class>
      </servlet>
    <servlet-mapping>
        <servlet-name>ImgCodeServlet</servlet-name>
        <url-pattern>/servlet/ImgCodeServlet</url-pattern>
      </servlet-mapping>

2、登录的Action中来利用Ajax校验 用户名、密码、验证码

Action校验：

public String checkAjaxLogin()
        {
            Map session = ActionContext.getContext().getSession();
            String identifyCode = (String)session.get("rand");
            if (identifyCode.toUpperCase().equals(code.toUpperCase()))
            {
                
                if (!"admin".equals(userName))
                {
                    //用户名不存在
                    message = "userName_Error";
                }
                else if (!"admin".equals(passWord))
                {
                    //用户名或密码错误
                    message = "userNameandPassWord_Error";
                }
                else
                {
                    message = "success";
                }
            }
            else
            {
                //验证码错误
                message = "code_error";
            }
            
            return SUCCESS;
        }

Action配置：

<package name="jqueryAjax-doo" extends="json-default">
    			<action name="queryAjaxLogin" class="com.actions.query.UseQueryAction" method="checkAjaxLogin">
    			  <result type="json">
    			       <param name="root">message</param>
    			       <param name="noCache">true</param>	      
    			  </result>
    			</action>
    	</package>

登录事件的Ajax验证：

$.ajax({
                    type:"post",
                    url:"queryAjaxLogin.action",
                    data:{"userName":userName,"passWord":passWord,"code":code},
                    success:function(data)
                    {
                        if(data=="code_error")
                        {
                            alert("验证码错误。");
                            
                        }
                        else if(data=="userName_Error")
                        {
                            alert("用户名不存在。");
                            
                        }
                        else if(data=="userNameandPassWord_Error")
                        {
                        	alert("用户名或密码错误。");
                        	
                        }
                        else
                        {
                        	window.location="Login.action";
                        	
                        }
    
                    }