验证码雏形

首先呢，我们应该知道的是该验证码是在图片中进行的操作，因此我们需要调用image中的子类BufferedImage，而该子类的作用是将图片加载到内存中，其生成的图片在内存中有一个图像缓冲区，可以让我们对图片进行操作。

int width = 100;
int height = 50;
BufferedImage image = new BufferedImage(width,height,BufferedImage.TYPE_INT_RGB);

在生成图像之后，就可以开始对其进行一系列的操作，使其更像是一个验证码。而这里要用到的则是Java类中的Graphics类，在此处我们就不对其概念过多的赘述了，能够看懂怎么用就好了，而想了解的同学可以进一步的了解其相关知识。

Graphics g = image.getGraphics();
//获取image中的Graphics
g.setColor(Color.pink);
//设置画笔的颜色
g.fillRect(0,0,width,height);
//颜色填充整个图像
//以该图像的原点为起始位置，填充宽为width、长为height大小
g.setColor(Color.black);
//重新设置画笔的颜色
g.drawRect(0,0,width-1,height-1);
//为图像画上相框，在此减一是因为刚好重合了

图像美化之后，就需要在其中添加验证码了而这个过程还是要用到Graphics中的方法

        String str = "ABCDEFGHIJKLMNOPQRSTUVWXYZqwertyuiopasdfghjklzxcvbnm1234567890";
        Random r = new Random();
        for (int i = 1; i < 5; i++) {
            int index = r.nextInt(str.length());
            char ch = str.charAt(index);
            g.drawString(ch+"",width/5*i,height/2);
        }
        //实现验证码的随机生成
        g.setColor(Color.yellow);
        //重新设置画笔颜色
        for (int i = 0; i < 10; i++) {
            int x1 = r.nextInt(width);
            int x2 = r.nextInt(width);
            int y1 = r.nextInt(height);
            int y2 = r.nextInt(height);
            g.drawLine(x1,y1,x2,y2);
        }
        //实现随机线条的生成
        ImageIO.write(image,"jpg",response.getOutputStream());
        //通过ImageIO实现图像的输出

然而这还是在Servlet中实现，具体操作时我们应该让它能够和前端相结合。

验证码1.0

前面我们的验证码还只是在Servlet中实现，接下来呢，我们可以尝试着使其于前端相结合起来。

<body>
<img id = "checkcode" src="/Test/checkCodeServlet">
<a id="change" href="">看不清换一张？</a>
</body>

定义img标签和a标签，并分别定义id属性，方便后续用来在JavaScript中获取它。

<script>
        window.onload=function (){
            var img = document.getElementById("checkcode");
            img.onclick=function (){
                var date = new Date().getTime();
                img.src = "/Test/checkCodeServlet?"+date;
            }
        }
</script>

为img标签设置点击事件，每次点击之后都会再次获取Servlet中的图像，从而实现，验证码的更新，然而由于浏览器中有缓存的缘故，在重新获取的时候，浏览器并不会再次获取，而是将原来的数据重新返回，因此需要对src的值需要不重复才可以，而时间戳刚好符合不重复，因为每次获取的时候都会重新获取时间。

Java实现可点击切换验证码

验证码雏形

验证码1.0

实现效果