注册--验证码制作

灰太狼 2022-01-27 01:59 344阅读 0赞

### 1.input 输入框和验证码图片（src 属性引入图片）： ###

代码解读如下：  
（1）onclick 点击事件 changeCaptcha() 方法，点击之后 更换验证码，具体方法如下：

function  changeCaptcha(){
    		$("#captchaImg").attr('src','${ctx}/captchaServlet?t=' + (new Date().getTime()));
    }

> 注：$\{ctx\} 指的是 $\{pageContext.request.contextPath \}

根据 id(captchaImg) 获取 image 标签对象，将它的 src 属性值替换成新的验证码图片。

（2）src 属性值对应的是一个Servlet ，Servlet 对应的URL是 /captchaServlet，当页面加载的时候它会调用该 Servlet 的方法，返回一个验证码图片。

**在 web.xml 文件中配置 captchaServlet**

<servlet>
    	    <servlet-name>CaptchaServlet</servlet-name>
    	    <servlet-class>
    	      chen.www.common.CodeCaptchaServlet
    	    </servlet-class>
     </servlet>
    <servlet-mapping>
    	    <servlet-name>CaptchaServlet</servlet-name>
    	    <url-pattern>/captchaServlet</url-pattern>
    </servlet-mapping>

调用 captchaServlet 的过程：  
（1）根据 URL /captchaServlet 找到名为 CaptchaServlet 的 Servlet。  
（2）然后根据名字 CaptchaServlet 找到具体的 Servlet 位置，就可以调用其中的方法返回验证码图片。

3.在 common 包下引入 CodeCaptchaServlet.java，制作验证码的类，主要是通过 Graphics 设置图片大小，然后随机生成干扰点和4位随机验证码，并保存到 Session 中，用于注册时验证。生成验证码的 CodeCaptchaServlet.java 文件,可以当作工具类来直接使用。

package chen.www.common;
    
    import javax.imageio.ImageIO;
    import javax.servlet.ServletException;
    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;
    
    
    public class CodeCaptchaServlet extends HttpServlet {
    
        public static final String VERCODE_KEY = "VERCODE_KEY";
        
        @Override
        protected void doGet(HttpServletRequest request, HttpServletResponse response)
                throws ServletException, IOException {
            
           // request.getSession().removeAttribute(LOGIN_VERCODE_KEY);
            request.getSession().removeAttribute(VERCODE_KEY);
            // 首先设置页面不缓存
            response.setHeader("Pragma", "No-cache");
            response.setHeader("Cache-Control", "no-cache");
            response.setDateHeader("Expires", 0);
            
          //在内存中创建图象
            int iWidth = 55, iHeight = 18;
            BufferedImage image = new BufferedImage(iWidth, iHeight,
                    BufferedImage.TYPE_INT_RGB);
            //获取图形上下文
            Graphics g = image.getGraphics();
            //设定背景色
            g.setColor(Color.white);
            g.fillRect(0, 0, iWidth, iHeight);
            //画边框
            g.setColor(Color.black);
            g.drawRect(0, 0, iWidth - 1, iHeight - 1);
            //取随机产生的认证码(4位数字)
            //String rand = Utils.getCharacterAndNumber(4);
            int intCount=0; 
            intCount=(new Random()).nextInt(9999);// 
    
            if(intCount <1000)intCount+=1000; 
            String rand=intCount+"";
            //将认证码显示到图象中
            g.setColor(Color.black);
            g.setFont(new Font("Times New Roman", Font.PLAIN, 18));
            g.drawString(rand, 5, 15);
            //随机产生88个干扰点,使图象中的认证码不易被其它程序探测到
            Random random = new Random();
            for (int iIndex = 0; iIndex < 100; iIndex++) {
                int x = random.nextInt(iWidth);
                int y = random.nextInt(iHeight);
                g.drawLine(x, y, x, y);
            }
            
            // 将生成的随机字符串写入session
           // request.getSession().setAttribute(LOGIN_VERCODE_KEY, rand);
            request.getSession().setAttribute(VERCODE_KEY, rand);
            //图象生效
            g.dispose();
            //输出图象到页面
            ImageIO.write(image, "JPEG", response.getOutputStream());
        }
    
        @Override
        protected void doPost(HttpServletRequest req, HttpServletResponse resp)
                throws ServletException, IOException {
            super.doPost(req, resp);
        }
    
        @Override
        public void init()
                throws ServletException {
            super.init();
        }
    
        private static final long serialVersionUID = 5413310437308046316L;
        
    }