手机验证码登录

//生成验证码
@RequestMapping("/smsGet")
@ResponseBody
public void smsGet(String phone) throws Exception {
    int smsCode = new Random().nextInt(999999);
    mdUtil.smsPost(phone, smsCode);
    redisOperator.set(3, Const.PHONE_SMS_REDIS + phone, smsCode, RedisSessionUtil.SESSION_SMS_EXPIRE_SECONDS);
}

//短信验证码验证是否正确controller
@RequestMapping("/smsLogin")
@ResponseBody
public Object smsLogin(String phone, int smsCode) throws Exception {
    return loginService.smsLogin(phone, smsCode);
}


//实现类

//手机快捷登录验证验证码是否正确
@Override
public Object smsLogin(String phone, int smsCode) {
    int oldSmsCode = redisOperator.get(3, Const.PHONE_SMS_REDIS + phone, Integer.class);
    if (oldSmsCode == smsCode) {
        //验证码正确
        String userId = sysUserMapper.findByPhoneCount(phone);
        if (userId != null && userId != "") {
            //已经存在用户,登录成功。
            SysUser sysUser = sysUserMapper.selectUserByUserId(userId);
            //sysUser.setPassword("");
            String token = TokenUtil.getInstance().makeToken();
            redisOperator.set(1, token, sysUser, RedisSessionUtil.SESSION_EXPIRE_SECONDS);
            return new Results(Const.LOGIN_SUCCESS, "登录成功", token);
        }else {
            //用户不存在  返回注册页面
            return new Results(Const.TO_REGISTER,"用户不存在");
        }
    }
    //验证码错误
    return new Results(Const.SMSCODE_ISNOT_FOUNT, "验证码错误");
}

 

 

第三方秒嘀工具类发送验证码的方法

public void smsPost(String phone, int code) throws Exception {
    StringBuilder sb = new StringBuilder();
    sb.append("accountSid").append("=").append(ACCOUNT_SID);
    sb.append("&to").append("=").append(phone);
    sb.append("&param").append("=").append(URLEncoder.encode(String.valueOf(code), "UTF-8"));
    sb.append("&templateid").append("=").append(MD_ID);
    String body = sb.toString() + createCommonParam(ACCOUNT_SID, AUTH_TOKEN);
    String result = post(BASE_URL, body);
    System.out.println(result);
}

 

 

点击获取验证码的按钮的js

//生成验证码
var phoneReg = /(^1[3|4|5|7|8]\d{9}$)|(^09\d{8}$)/;//手机号正则
var count = 60; //间隔函数，1秒执行
var InterValObj1; //timer变量，控制时间
var curCount1;//当前剩余秒数
/*第一*/
function sendMessage1() {
    curCount1 = count;
    var phone1 = $.trim($('#phone').val());
    if (!phone1) {
        layer.msg("请输入手机号", {icon: 6});
        return;
    }
    if (!phoneReg.test(phone1)) {
        layer.msg("请输入有效的手机号码", {icon: 6});
        return false;
    }
    //设置button效果，开始计时
    $("#btnSendCode1").attr("disabled", "true");
    $("#btnSendCode1").val(+curCount1 + "秒再获取");
    InterValObj1 = window.setInterval(SetRemainTime1, 1000); //启动计时器，1秒执行一次
    $.ajax({
        url: httpurl + "/api/smsGet",
        type: "post",
        dataType: "json",
        data:{phone: phone1},
        success:function () {
        }
    });
}

验证码按钮的计时器

function SetRemainTime1() {
    if (curCount1 == 0) {
        window.clearInterval(InterValObj1);//停止计时器
        $("#btnSendCode1").removeAttr("disabled");//启用按钮
        $("#btnSendCode1").val("重新发送");
    } else {
        curCount1--;
        $("#btnSendCode1").val(+curCount1 + "秒再获取");
    }
}

 

点击登录按钮的js

//短信验证码点击登录按钮
$("#go1").on("click",function () {
    var phone2=$.trim($('#phone').val());
    var smscode=$.trim($('#smscode').val());
    if (!phone2) {
        layer.msg("请输入手机号", {icon: 6});
        return;
    }
    if (!smscode) {
        layer.msg("请输入验证码", {icon: 6});
        return;
    }
    //点击登录时验证
    //向后台发送处理数据
    $.ajax({
        url: httpurl + "/api/smsLogin",
        type: "post",
        dataType: "json",
        data: {phone: phone2,smsCode:smscode},
        success: function (result) {
            if (result.code == 504) {
                layer.msg("验证码错误,请重新获取", {icon: 4});
            }
            if (result.code == 301) {
                layer.msg("用户不存在请注册", {icon: 6})
                window.location.href = "/views/login/app-register.html";
            }
            if (result.code == 200) {
                layer.msg("登录成功！", {icon: 6})
                localStorage.setItem("token", JSON.stringify(result.data));
                window.location.href = "/views/login/person/personindex.html";
            }
        }
    })
})