博客
关于我
验证码的简单实现
阅读量:358 次
发布时间:2019-03-04

本文共 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 表单实现

    
Title 看不清换一张?

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

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

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

在这里插入图片描述
但是这里也存在个问题,点击图片实现自动更改,但是实际上是跳转到了另外一个注册码的页面,没有停留在 register.html 页面,所以点击文字"看不清,换一张",只会出现一次效果

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

看不清换一张

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

    
验证码 看不清换一张

转载地址:http://lxxr.baihongyu.com/

你可能感兴趣的文章
nginx反向代理
查看>>
nginx反向代理、文件批量改名及统计ip访问量等精髓总结
查看>>
Nginx反向代理与正向代理配置
查看>>
Nginx反向代理及负载均衡实现过程部署
查看>>
Nginx反向代理是什么意思?如何配置Nginx反向代理?
查看>>
nginx反向代理解决跨域问题,使本地调试更方便
查看>>
Nginx反向代理配置
查看>>
Nginx启动SSL功能,并进行功能优化,你看这个就足够了
查看>>
nginx启动脚本
查看>>
Nginx在Windows上和Linux上(Docker启动)分别配置基本身份认证示例
查看>>
Nginx在Windows下载安装启动与配置前后端请求代理
查看>>
Nginx多域名,多证书,多服务配置,实用版
查看>>
nginx如何实现图片防盗链
查看>>
Nginx学习总结(13)——Nginx 重要知识点回顾
查看>>
Nginx学习总结(14)——Nginx配置参数详细说明与整理
查看>>
nginx学习笔记002---Nginx代理配置_案例1_实现了对前端代码的方向代理_并且配置了后端api接口的访问地址
查看>>
Nginx安装与常见命令
查看>>
Nginx安装及配置详解
查看>>
Nginx实战经验分享:从小白到专家的成长历程!
查看>>
Nginx实现反向代理负载均衡
查看>>