zoukankan      html  css  js  c++  java
  • springboot搭建项目,实现Java生成随机图片验证码。

    这篇文章主要介绍了如何通过Java如何生成验证码并验证。验证码的作用我想必大家都知道,话不多说开始实施!

    首先创建一个springboot项目,创建Springboot项目在这篇文章中我也有清晰的介绍:https://www.cnblogs.com/bgyb/p/12070279.html

    以下是项目结构,内有utli工具类、存放生成图片验证码方法、controller存放一些拦截请求方法。

    接下来 在utli中创建一个Class类,进行生成随机图片验证码,代码如下

    public class DrawmageUtil {
    
        private static final long serialVersionUID = 3038623696184546092L;
        public static final int WIDTH = 120;//生成的图片的宽度
        public static final int HEIGHT = 30;//生成的图片的高度
    
        /**
                * 设置图片的背景色
         * @param g
         */
        public void setBackGround(Graphics g) {
            // 设置颜色
            g.setColor(Color.WHITE);
            // 填充区域
            g.fillRect(0, 0, WIDTH, HEIGHT);
        }
    
        /**
         * 设置图片的边框
         * @param g
         */
        public void setBorder(Graphics g) {
            // 设置边框颜色
            g.setColor(Color.BLUE);
            // 边框区域
            g.drawRect(1, 1, WIDTH - 2, HEIGHT - 2);
        }
    
        /**
         * 在图片上画随机线条
         * @param g
         */
        public void drawRandomLine(Graphics g) {
            // 设置颜色
            g.setColor(Color.GREEN);
            // 设置线条个数并画线
            for (int i = 0; i < 5; i++) {
                int x1 = new Random().nextInt(WIDTH);
                int y1 = new Random().nextInt(HEIGHT);
                int x2 = new Random().nextInt(WIDTH);
                int y2 = new Random().nextInt(HEIGHT);
                g.drawLine(x1, y1, x2, y2);
            }
        }
    
        /**
         * 画随机字符
         * @param g
         * @param createTypeFlag
         * @return
         * String... createTypeFlag是可变参数,
         * Java1.5增加了新特性:可变参数:适用于参数个数不确定,类型确定的情况,java把可变参数当做数组处理。注意:可变参数必须位于最后一项
         */
        public String drawRandomNum(Graphics2D g,String... createTypeFlag) {
            // 设置颜色
            g.setColor(Color.RED);
            // 设置字体
            g.setFont(new Font("宋体", Font.BOLD, 20));
            //常用的中国汉字
            String baseChineseChar = "u7684u4e00u4e86u662fu6211u4e0du5728u4ebau4eecu6709u6765u4ed6u8fd9u4e0au7740u4e2au5730u5230u5927u91ccu8bf4u5c31u53bbu5b50u5f97u4e5fu548cu90a3u8981u4e0bu770bu5929u65f6u8fc7u51fau5c0fu4e48u8d77u4f60u90fdu628au597du8fd8u591au6ca1u4e3au53c8u53efu5bb6u5b66u53eau4ee5u4e3bu4f1au6837u5e74u60f3u751fu540cu8001u4e2du5341u4eceu81eau9762u524du5934u9053u5b83u540eu7136u8d70u5f88u50cfu89c1u4e24u7528u5979u56fdu52a8u8fdbu6210u56deu4ec0u8fb9u4f5cu5bf9u5f00u800cu5df1u4e9bu73b0u5c71u6c11u5019u7ecfu53d1u5de5u5411u4e8bu547du7ed9u957fu6c34u51e0u4e49u4e09u58f0u4e8eu9ad8u624bu77e5u7406u773cu5fd7u70b9u5fc3u6218u4e8cu95eeu4f46u8eabu65b9u5b9eu5403u505au53ebu5f53u4f4fu542cu9769u6253u5462u771fu5168u624du56dbu5df2u6240u654cu4e4bu6700u5149u4ea7u60c5u8defu5206u603bu6761u767du8bddu4e1cu5e2du6b21u4eb2u5982u88abu82b1u53e3u653eu513fu5e38u6c14u4e94u7b2cu4f7fu5199u519bu5427u6587u8fd0u518du679cu600eu5b9au8bb8u5febu660eu884cu56e0u522bu98deu5916u6811u7269u6d3bu90e8u95e8u65e0u5f80u8239u671bu65b0u5e26u961fu5148u529bu5b8cu5374u7ad9u4ee3u5458u673au66f4u4e5du60a8u6bcfu98ceu7ea7u8ddfu7b11u554au5b69u4e07u5c11u76f4u610fu591cu6bd4u9636u8fdeu8f66u91cdu4fbfu6597u9a6cu54eau5316u592au6307u53d8u793eu4f3cu58ebu8005u5e72u77f3u6ee1u65e5u51b3u767eu539fu62ffu7fa4u7a76u5404u516du672cu601du89e3u7acbu6cb3u6751u516bu96beu65e9u8bbau5417u6839u5171u8ba9u76f8u7814u4ecau5176u4e66u5750u63a5u5e94u5173u4fe1u89c9u6b65u53cdu5904u8bb0u5c06u5343u627eu4e89u9886u6216u5e08u7ed3u5757u8dd1u8c01u8349u8d8au5b57u52a0u811au7d27u7231u7b49u4e60u9635u6015u6708u9752u534au706bu6cd5u9898u5efau8d76u4f4du5531u6d77u4e03u5973u4efbu4ef6u611fu51c6u5f20u56e2u5c4bu79bbu8272u8138u7247u79d1u5012u775bu5229u4e16u521au4e14u7531u9001u5207u661fu5bfcu665au8868u591fu6574u8ba4u54cdu96eau6d41u672au573au8be5u5e76u5e95u6df1u523bu5e73u4f1fu5fd9u63d0u786eu8fd1u4eaeu8f7bu8bb2u519cu53e4u9ed1u544au754cu62c9u540du5440u571fu6e05u9633u7167u529eu53f2u6539u5386u8f6cu753bu9020u5634u6b64u6cbbu5317u5fc5u670du96e8u7a7fu5185u8bc6u9a8cu4f20u4e1au83dcu722cu7761u5174u5f62u91cfu54b1u89c2u82e6u4f53u4f17u901au51b2u5408u7834u53cbu5ea6u672fu996du516cu65c1u623fu6781u5357u67aau8bfbu6c99u5c81u7ebfu91ceu575au7a7au6536u7b97u81f3u653fu57ceu52b3u843du94b1u7279u56f4u5f1fu80dcu6559u70edu5c55u5305u6b4cu7c7bu6e10u5f3au6570u4e61u547cu6027u97f3u7b54u54e5u9645u65e7u795eu5ea7u7ae0u5e2eu5566u53d7u7cfbu4ee4u8df3u975eu4f55u725bu53d6u5165u5cb8u6562u6389u5ffdu79cdu88c5u9876u6025u6797u505cu606fu53e5u533au8863u822cu62a5u53f6u538bu6162u53d4u80ccu7ec6";
            //数字和字母的组合
            String baseNumLetter = "0123456789ABCDEFGHJKLMNOPQRSTUVWXYZ";
            //纯数字
            String baseNum = "0123456789";
            //纯字母
            String baseLetter = "ABCDEFGHJKLMNOPQRSTUVWXYZ";
            //createTypeFlag[0]==null表示没有传递参数
            if (createTypeFlag.length > 0 && null != createTypeFlag[0]) {
                if (createTypeFlag[0].equals("ch")) {
                    // 截取汉字
                    return createRandomChar(g, baseChineseChar);
                }else if (createTypeFlag[0].equals("nl")) {
                    // 截取数字和字母的组合
                    return createRandomChar(g, baseNumLetter);
                }else if (createTypeFlag[0].equals("n")) {
                    // 截取数字
                    return createRandomChar(g, baseNum);
                }else if (createTypeFlag[0].equals("l")) {
                    // 截取字母
                    return createRandomChar(g, baseLetter);
                }
            }else {
                // 默认截取数字和字母的组合
                return createRandomChar(g, baseNumLetter);
            }
    
            return "";
        }
    
        /**
         * 创建随机字符
         * @param g
         * @param baseChar
         * @return 随机字符
         */
        public String createRandomChar(Graphics2D g,String baseChar) {
            StringBuffer sb = new StringBuffer();
            int x = 5;
            String ch ="";
            // 控制字数
            for (int i = 0; i < 4; i++) {
                // 设置字体旋转角度
                int degree = new Random().nextInt() % 30;
                ch = baseChar.charAt(new Random().nextInt(baseChar.length())) + "";
                sb.append(ch);
                // 正向角度
                g.rotate(degree * Math.PI / 180, x, 20);
                g.drawString(ch, x, 20);
                // 反向角度
                g.rotate(-degree * Math.PI / 180, x, 20);
                x += 30;
            }
            return sb.toString();
        }
    }

    创建好工具类后,在实现拦截请求的方法,创建一个Controller拦截。

    @RestController
    @RequestMapping("/CheckServlet")
    public class DrawImage {
    
        private DrawmageUtil drawmageUtil=new DrawmageUtil();
    
        //生成验证码
        @GetMapping("/DrawImage")
        public void DrawImage(@RequestParam("createTypeFlag") String createTypeFlag, HttpServletRequest request, HttpServletResponse response) throws IOException {
    
            //1.在内存中创建一张图片
            BufferedImage bi = new BufferedImage(DrawmageUtil.WIDTH, DrawmageUtil.HEIGHT, BufferedImage.TYPE_INT_RGB);
            //2.得到图片
            Graphics g = bi.getGraphics();
            //3.设置图片的背影色
            drawmageUtil.setBackGround(g);
            //4.设置图片的边框
            drawmageUtil.setBorder(g);
            //5.在图片上画干扰线
            drawmageUtil.drawRandomLine(g);
            //6.写在图片上随机数
            //String random = drawRandomNum((Graphics2D) g,"ch");//生成中文验证码图片
            //String random = drawRandomNum((Graphics2D) g,"nl");//生成数字和字母组合的验证码图片
            //String random = drawRandomNum((Graphics2D) g,"n");//生成纯数字的验证码图片
            //String random = drawRandomNum((Graphics2D) g,"l");//生成纯字母的验证码图片
            String random = drawmageUtil.drawRandomNum((Graphics2D) g, createTypeFlag);//根据客户端传递的createTypeFlag标识生成验证码图片
            //7.将随机数存在session中
            request.getSession().setAttribute("checkcode", random);
            //8.设置响应头通知浏览器以图片的形式打开
            response.setContentType("image/jpeg");//等同于response.setHeader("Content-Type", "image/jpeg");
            //9.设置响应头控制浏览器不要缓存
            response.setDateHeader("expries", -1);
            response.setHeader("Cache-Control", "no-cache");
            response.setHeader("Pragma", "no-cache");
            //10.将图片写给浏览器
            ImageIO.write(bi, "jpg", response.getOutputStream());
        }
    
    
        //验证验证码是否正确
        @RequestMapping("/checkboolean")
        public boolean checkboolean(HttpServletRequest request,@RequestParam("validateCode")String validateCode){
            boolean br=false;
            String serverCheckcode = (String) request.getSession().getAttribute("checkcode");//从服务器端的session中取出验证码
            if (validateCode.equals(serverCheckcode)) { //将客户端验证码和服务器端验证比较,如果相等,则表示验证通过
                br=true;
            }
            return br;
        }
    
    
    }

     

     准备工作做好后开始写静态页面HTML了,在static下新建一个index.html

    <h3>验证码</h3>
            <input type="text" id="validateCode" placeholder="数字字母混合验证码"/><br/>
            <img alt="验证码看不清,换一张" src="CheckServlet/DrawImage?createTypeFlag=nl" id="validateCodeImg1" onclick="changeImg('nl')">
            <br/>
    
            <input type="text" placeholder="中文验证码:" name="validateCode"/><br/>
            <img alt="验证码看不清,换一张" src="CheckServlet/DrawImage?createTypeFlag=ch" id="validateCodeImg2" onclick="changeImg('ch')">
            <br/>
            <input type="text" placeholder="英文验证码:" name="validateCode"/><br/>
            <img alt="验证码看不清,换一张" src="CheckServlet/DrawImage?createTypeFlag=l" id="validateCodeImg3" onclick="changeImg('l')">
            <br/>
            <input type="text" placeholder=" 数字验证码:" name="validateCode"/><br/>
            <img alt="验证码看不清,换一张"  src="CheckServlet/DrawImage?createTypeFlag=n" id="validateCodeImg4" onclick="changeImg('n')">
            <br/>
            <input type="button" onclick="changeImgVerify()" value="验证">
    
    
    
    
    <!--js中的代码-->
    <script>
    //验证码请求方法二,点击图片刷新验证码
    function changeImg(value){

    $("#validateCodeImg1").attr("src", 'CheckServlet/DrawImage?
            createTypeFlag='+value+"&" + Math.random());//jquery方式
        }
    
    
        //提交到后台验证验证码
        function changeImgVerify(){
            var value =$("#validateCode").val();
            $.ajax({
                async: false,
                type: 'post',
                url: 'CheckServlet/checkboolean',
                dataType: "json",
                data: {
                    validateCode: value
                },
                success: function (result) {
                    if (result) {
                        alert("success!");
                    } else {
                        alert("failed!");
                    }
                    changeImg('ch');//回调函数
                }
            });
        }
    </script>

    以上步骤完成后启动项目,本人在配置文件中改了端口号所以,访问http://localhost:8082/,就可访问index.html文件,效果如下。。。。

     

    在框内输入验证码提交,Controller拦截请求进行验证,因为图片验证码生成好之后是存到session中的,后台直接对比提交的验证码是否与session中一致。可自定义返回值。

     

    至此Java生成验证码完结,本人只是写了一个简单的小demo有能力的朋友可自行扩展实现自己想要的。

    此文章来自一个努力做IT界中一股清流的小伙子。喜欢的朋友记得帮我顶一下!!

  • 相关阅读:
    CSS盒子模型
    getContextPath、getServletPath、getRequestURI、request.getRealPath的区别
    MYSQL中的CASE WHEN END AS
    单点登录的精华总结
    git&github
    June 21st 2017 Week 25th Wednesday
    June 20th 2017 Week 25th Tuesday
    June 19th 2017 Week 25th Monday
    June 18th 2017 Week 25th Sunday
    June 17th 2017 Week 24th Saturday
  • 原文地址:https://www.cnblogs.com/bgyb/p/12070288.html
Copyright © 2011-2022 走看看