SpringBoot整合Redis，使用StringRedisTemplate+ajax实现手机验证码（含源码）

男娘i 2023-07-09 10:27 22阅读 0赞

SpringBoot使用StringRedisTemplate实现手机验证码，首先你得先确保你能够连接上redis。能连接上之后，就可以开始写代码了。  
下面是我的一个例子StringRedisTemplate+ajax实现手机验证码的一个例子：

## 前端： ##

<!doctype html>
    <html lang="en">
    <head>
        <meta charset="utf-8">
        <title>verify</title>
        <link rel="stylesheet" type="text/css" href="/css/login.css" />
        <script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
        <script>
            var t=120;
            var interval;
            function getVerifyCode() { 
                $.get("/getVerifyCode",$("#codeForm").serialize(),function (data) { 
                    if (data=="true"){ 
                        t=120;
                        clearInterval(interval);
                        interval=setInterval("timekeeping()",1000);
                    }else { 
                        clearInterval(interval);
                        $('#time').text("您已经超过次数，请明日再来");
                    }
                })
            }
            function timekeeping() { 
                $('#time').text("请在"+t+"秒内填写验证码");
                t--;
                if(t<=0){ 
                    clearInterval(interval);
                    $('#time').text("验证码失效,请点击重新发送");
                }
            }
            function verify() { 
                $.get("/verifyCode",$("#codeForm").serialize(),function (data) { 
                    if (data=="true") { 
                        clearInterval(interval);
                        alert("登录成功")
                    }else { 
                        alert("验证码输入错误");
                    }
    
                })
                
            }
        </script>
    </head>
    
    <body>
    <div class="form">
        <form id="codeForm">
            <h1 style="text-align: center">请登录</h1>
    
            电话号码：<input type="text" id="inputPhoneNumber" name="inputPhoneNumber" placeholder="电话号码"/><br>
            <div id="time" style="font-size: 12px"></div><br>
            验 证 码 ：<input type="text" id="inputVerifyCode" name="inputVerifyCode" placeholder="验证码"><br>
    
            <input type="checkbox"> 记住我<br>
    
            <input type="button"  class="getVerifyCode" value="获取验证码" onclick="getVerifyCode();">
                  <input type="button" class="login" value="登录" onclick="verify()">
        </form>
    </div>
    
    </body>
    </html>

## 后台控制器（一个是获取验证码的，另一个是验证验证码的）： ##

@Autowired
        StringRedisTemplate stringRedisTemplate;
    	
    	public String getRandom(int lenth) { 
            String code = "";
            Random random = new Random();
            for (int i = 0; i < lenth; i++) { 
                int num = random.nextInt(10);
                code = code + String.valueOf(num);
            }
            return code;
        }
    
    	@ResponseBody
        @RequestMapping("/verifyCode")
        public String verifyCode(@RequestParam("inputPhoneNumber") String phoneNumber, @RequestParam("inputVerifyCode") String inputVerifyCode){ 
    
            String uverifyCode=phoneNumber+":verifyCode";
            String key=stringRedisTemplate.opsForValue().get(uverifyCode);
            if (inputVerifyCode.equals(key)){ 
                return "true";
            }
            return "false";
        }
    
    
    	@ResponseBody
        @RequestMapping("/getVerifyCode")
        public String getVerifyCode(@RequestParam("inputPhoneNumber") String phoneNumber, @RequestParam("inputVerifyCode") String inputVerifyCode) { 
    
            String uid = phoneNumber + ":phoneNumber";//设置存放电话号码的key
            String ucount = phoneNumber + ":count";//设置每个用户的每日获取验证码的次数
            if (!stringRedisTemplate.hasKey(uid)) { //代表不存在这个key
                stringRedisTemplate.opsForValue().set(ucount, "0", 1, TimeUnit.DAYS);
            } else if (Integer.parseInt(stringRedisTemplate.opsForValue().get(ucount)) >= 2) { //代表超过三次
                return "false";
            } else { 
                stringRedisTemplate.opsForValue().increment(ucount);//给次数加一
            }
    
            stringRedisTemplate.opsForValue().set(uid, phoneNumber);
            String verifyCode = this.getRandom(6);
            String uverifyCode = phoneNumber + ":verifyCode";//设置存放验证码的key
            stringRedisTemplate.opsForValue().set(uverifyCode, verifyCode, 120, TimeUnit.SECONDS);
            return "true";
        }