短信验证码完成注册功能

JavaScript

//获取手机短信验证码
                $("#smsCaptchaButton").on('click', function () {

                    var btn = $("#smsCaptchaButton");
                    //按钮text值
                    var oldBtnText = btn.text();
                    var mobile =$("#mobile").val();
                    var TEL_REGEXP = /^1([38][0-9]|4[579]|5[0-3,5-9]|6[6]|7[0135678]|9[89])\d{8}$/;
                    if(mobile.length>0){
                        if (TEL_REGEXP.test(mobile)) {
                            $.ajax({
                                type: "POST",
                                url: "/sms/sendSmsCaptcha",
                                data: {'mobile': mobile},
                                dataType: "json",
                                success: function () {
                                    $.bootstrapGrowl("发送成功，请注意查收",{
                                        type: 'success',
                                    });
                                },
                                error: function () {
                                    $.bootstrapGrowl("发送失败", {
                                        type: 'danger'
                                    });
                                }
                            });
                            //设置计时60秒
                            var time = 60;
                            //禁用按钮
                            btn.attr("disabled", true);
                            //设置定时器
                            var btnTimer = null;
                            btnTimer = setInterval(function () {
                                //开始计数
                                time--;
                                if (time <= 0) {
                                    btn.removeAttr('disabled');
                                    btn.text(oldBtnText);
                                    clearInterval(btnTimer);
                                } else {
                                    btn.text(time + "秒后可再次发送");
                                }
                            }, 1000);
                        } else {
                            $.bootstrapGrowl("请输入正确的手机号", {
                                type: 'info'
                            });
                        }
                    }else{
                        $.bootstrapGrowl("请先输入手机号", {
                            type: 'info'
                        });
                    }
                });

 

HTML

<div class="form-group">
    <label class="col-xs-3 control-label item-required" for="captcha">验证码:</label>
    <div class="col-xs-8">
        <div class="input-group">
            <input id="registerSmsCode" name="registerSmsCode" class="captcha form-control" type="text" maxlength="6" autocomplete="off">
            <span class="input-group-btn">
                <button class="btn btn-default" type="button" id="smsCaptchaButton">获取验证码</button>
            </span>
        </div>
    </div>
</div>

Java

    @RequestMapping(value = "/sendSmsCaptcha",method = RequestMethod.POST)
    @ResponseBody
    public ResponseEntity<?> sendRegisterSms(@RequestParam(value = "mobile") String mobile) {
        Map<String, Object> resultMap = new HashMap<>();
        try {
            //设置同手机号发送限制次数 3次之后不可再发
            Long count = stringRedisTemplate.opsForValue().increment("count:"+mobile, 1);
            assert count != null;
            int smsCount = count.intValue();
            if (smsCount > 3) {
                stringRedisTemplate.expire("count:" + mobile, 12, TimeUnit.HOURS);
                resultMap.put("msg", "发送失败，发送次数已用完，请在12小时后再尝试");
                return Results.status(HttpStatus.OK, resultMap);
            } else {
                //随机6位数验证码
                StringBuilder smsCode = new StringBuilder();
        　　　　　Random random = new Random();
        　　　　　for (int i = 0; i < 6; i++) {
        　　　　　　　　int r = random.nextInt(10); //每次随机出一个数字（0-9）
        　　　　　　　　smsCode.append(r);  //把每次随机出的数字拼在一起
         　　　　}
                String content = "你的验证码为："+smsCode+"，请不要把验证码泄露给其他人！10分钟内有效。 【xxxx】";
                smsService.send(mobile, content);
                //发送成功之后，将短信写入redis key：mobile  value ：smsCode  有效期十分钟
                stringRedisTemplate.opsForValue().set(mobile,smsCode,10, TimeUnit.MINUTES);
                resultMap.put("msg","操作成功");
                return Results.status(HttpStatus.OK, resultMap);
            }
        } catch (Exception e) {
            e.printStackTrace();
            resultMap.put("msg", "发送失败");
            return Results.status(HttpStatus.BAD_REQUEST, resultMap);
        }
    }