java实现图形验证码

首先img的src可以使用远程图片,也就是说他同样是可以请求后端的,这也就是实现图形验证码随机显示的原理。

配置html页面

  • 使用img组件,src请求一个后台地址。
  • 点击图片,传递随机数,获取随机验证码。
  • 下面代码基于Thymeleaf,因此使用了th:src属性。普通的页面的话,可以直接使用src属性。
 


注意:
其实,onclick是一个难点,点击之后传递一个随机数。使用this.src重新给该图片赋值。

实现后台控制方法

最终是使用ImageIO方法进行验证码的绘制。

@RequestMapping({"/ran/random"})
    public void genericRandomCode(HttpServletRequest request, HttpServletResponse response) throws IOException {
        response.setHeader("Cache-Control", "private,no-cache,no-store");
        response.setContentType("image/png");
        byte width = 85;
        byte height = 28;
        BufferedImage image = new BufferedImage(width, height, 2);
        Graphics2D g = image.createGraphics();
        g.setComposite(AlphaComposite.getInstance(3, 1.0F));
        Random random = new Random();
        g.setColor(new Color(231, 231, 231));
        g.fillRect(0, 0, width, height);
        g.setFont(new Font("Microsoft YaHei", 2, 24));
        String sRand = "";
        for(int responseOutputStream = 0; responseOutputStream < 4; ++responseOutputStream) {
            String rand = String.valueOf(random.nextInt(10));
            sRand = sRand + rand;
            g.setColor(new Color(121, 143, 96));
            g.drawString(rand, 13 * responseOutputStream + 16, 23);
        }
        g.dispose();
        ServletOutputStream var12 = response.getOutputStream();
        ImageIO.write(image, "png", var12);
        var12.close();
    }
  • for循环里面控制了一下随机数的位数,这里为4位。

通过以上方法,实现了随机校验码。

你可能感兴趣的:(java实现图形验证码)