注册--验证码制作-蒲公英云

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

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

<input id="code" name="code" type="text" class="chen_txt yanzm" placeholder="验证码" onblur="checkCode()">
     <div>
        <img id="captchaImg" style="CURSOR: pointer" onclick="changeCaptcha()"
           title="看不清楚?请点击刷新验证码!" align='absmiddle' src="${ctx}/captchaServlet"
                           height="18" width="55">
                      <a href="javascript:;"
                         onClick="changeCaptcha()" style="color: #666;">看不清楚</a>
                          <span id="code_span" style="color: red"></span>
      </div>

代码解读如下：
（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;
}