本文共 1937 字，大约阅读时间需要 6 分钟。

本质：图片

一、基本实现

@WebServlet("/checkCodeServlet")public class CheckCodeServlet extends HttpServlet {       protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {           int width = 100;        int height = 50;        //1.创建一对象，在内存中图片(验证码图片对象)        BufferedImage image = new BufferedImage(width,height,BufferedImage.TYPE_INT_RGB);        //2.美化图片        //2.1 填充背景色        Graphics g = image.getGraphics();//画笔对象        g.setColor(Color.PINK);//设置画笔颜色        g.fillRect(0,0,width,height);        //2.2画边框        g.setColor(Color.BLUE);        g.drawRect(0,0,width - 1,height - 1);        String str = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghigklmnopqrstuvwxyz0123456789";        //生成随机角标        Random ran = new Random();        for (int i = 1; i <= 4; i++) {               int index = ran.nextInt(str.length());            //获取字符            char ch = str.charAt(index);//随机字符            //2.3写验证码            g.drawString(ch+"",width/5*i,height/2);        }        //2.4画干扰线        g.setColor(Color.GREEN);        //随机生成坐标点        for (int i = 0; i < 10; i++) {               int x1 = ran.nextInt(width);            int x2 = ran.nextInt(width);            int y1 = ran.nextInt(height);            int y2 = ran.nextInt(height);            g.drawLine(x1,y1,x2,y2);        }        //3.将图片输出到页面展示        ImageIO.write(image,"jpg",response.getOutputStream());    }    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {           this.doPost(request,response);    }}

结果如图：

二、配合 html 表单实现

    
                   看不清换一张？

这里为了达到点击图片自动更换的效果，加了个时间戳

image.src = "/code?" + time;

这里的？和 time，没有任何意义，效果是让浏览器认为这是次新的刷新，不会去读取浏览器缓存

所以实际上，<a> 标签实现的是本页面的一个跳转，可以用以前学的一个

看不清换一张

然后通过 id ,添加事件即可

    
           看不清换一张