手机注册短信验证码实现的全流程及代码

1.以手机号码为参数调用后台接口发送登录验证码，注意同一号码发送短信的时间间隔和每日次数阈值
2.后台接口按规则要求生成验证码
3.将手机号码(Key)和验证码(Value)存入服务器缓存，同时设置缓存有效时间
4.将验证码填充短信模板作为短信内容，调用第三方短信运营商接口发送短信
5.客户端输入验证码触发登陆，将电话号码和验证码为参数，调用服务端登录验证接口
6。服务端登录验证接口校验缓存中对应的验证信息，如果匹配，返回登陆成功；否则返回失败原因

/*html代码*/<div><td width="235px">手机验证码：</td><td><input id="smsCode" name="smsCode" type="text" /></td><td><input type="button" id="sendSms" class="btn btn-primary" value="获取短信验证码" onclick="sendValidateCode(this)" /></td></div>

//JS代码
<script>/*** 发送短信验证码*/function sendValidateCode(obj) {var mobileReg = /^1[3|4|5|6|7|8|9][0-9]\d{8}$/;var countdown = 60, timerTag;var mobile = $("#mobile").val().trim();if (mobile != "") {var mobileResult = mobileReg.test(mobile);if (mobileResult) {$.ajax({url: "verifyCode",type: "post",dataType: "json",async: false,data: { mobile: mobile },beforeSend: function () {$("#sendSms").attr("disabled", "disabled");$(obj).css("background-color", "#999");},success: function (data) {if (data.result == "success") {alert("验证码发送成功，请注意查收！")setTime(obj, countdown, timerTag);} else {countdown = -1;}},complete: function () {$("#sendSms").removeAttr("disabled");},});} else {alert("请输入正确的手机号！");}} else {alert("手机号不能为空，请重新输入");}}/*** 短信验证码计数*/function setTime(obj, countdown, timerTag) {if (countdown <= 0) {$(obj).removeAttr("disabled").css("background-color", "rgb(24, 197, 133)");$("#sendSms").attr("onclick", "sendValidateCode(this)");//            $(obj).html("重新发送");$("#sendSms").val("点击重新获取验证码").removeAttr("disabled").removeClass("disabled");countdown = 60;clearTimeout(timerTag);} else {$("#sendSms").attr("disabled", true);//点击了"发送"按钮后，点击失效。$("#sendSms").addClass("disabled");//置灰//            $(obj).html("重新发送(" + countdown + ")");$("#sendSms").attr("value", "" + countdown + "秒后重新获取验证码");countdown--;timerTag = setTimeout(function () {setTime(obj, countdown, timerTag);}, 1000);}}
</script>

暂无后端代码

手机注册短信验证码实现的全流程及代码相关推荐

Web项目中手机注册短信验证码实现的全流程及代码
最近在做只能净化器的后台用户管理系统,需要使用手机号进行注册,找了许久才大致了解了手机验证码实现流程,今天在此和大家分享一下. 我们使用的是榛子云短信平台, 官网地址:http://smsow.zhe ...
c语言短信验证码,Web项目中手机注册短信验证码实现的全流程及代码
使用的是榛子云短信平台, 官网地址:http://smsow.zhenzikj.com 后端使用了springMvc,前端用的是jsp + jquery 下载demo: https://downloa ...
手机接收短信验证码生成(纯数字)
手机接收短信验证码生成--纯数字 Random类中的nextInt( )方法 nextInt() 纯数字短信验证码生成 Random类中的nextInt( )方法 nextInt() 不带参数,不带参 ...
SpringBoot 实现手机发送短信验证码
手机发送短信内容一.手机发送短信 1. 前端界面代码 2. UserInfoController 控制器 3. application.properties 配置类文件 4. 具体实现总结内容 ...
Nodejs实现给手机发送短信验证码用于登录功能(免费短信)
我们开发的应用通常需要通过手机短信验证码验证进行登录,方便了那些容易忘记密码的用户,同时也降低了是密码被盗的风险性. 文章目录 1.注册容联云通信账号(免费) 2.nodejs发送请求即可发送短信验证 ...
手机发送短信验证码登录完整实例
项目需求后台生成随机6位数作为验证码,发送给手机,同时将验证码存入缓存,用户登录时验证输入的验证码是否过期或者是否正确. 一.发送短信 1.了解短信发送通过发送短信的API,建立一个URL类的对象 ...
面试-Django实现注册短信验证码发送
注册的逻辑注册需要的参数用户名,密码等,主要是图片验证码等输入输入图片验证码之后,点击获得验证码,这时候要验证图片验证码的正确性图片验证码正确才会发生短信,用户收到短信之后,输入后,点击注册就可 ...
 php怎么做注册短信验证码
PHP注册短信接口代码示例说明 //接口类型:互亿无线触发短信接口,支持发送验证码短信.订单通知短信等. // 账户注册:请通过该地址开通账户http://user.ihuyi.com/?DKimmu ...
java 实现手机接收短信验证码功能
需求需要有发送手机短信的平台,这里以阿里云为例.如果没有,就不要试了,不会成功的. 创建一 ...
注册短信验证码防刷设计方案
1.需求:一定时间内禁止重复发送短信两个时间要求 60秒后才可以重新发送短信验证码发送的短信验证码10分钟内有效 2.方案方式一:前端增加校验倒计时,不到60秒按钮不给点 ...

手机注册短信验证码实现的全流程及代码

手机注册短信验证码实现的全流程及代码相关推荐

最新文章

热门文章