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

最近在做只能净化器的后台用户管理系统，需要使用手机号进行注册，找了许久才大致了解了手机验证码实现流程，今天在此和大家分享一下。

我们使用的是榛子云短信平台, 官网地址:http://smsow.zhenzikj.com

我是java开发者，后端使用了springMvc，前端用的是jsp + jquery

下载demo: https://download.csdn.net/download/zuoliangzhu/10733109

短信验证码实现流程

1、构造手机验证码，生成一个6位的随机数字串；
2、使用接口向短信平台发送手机号和验证码，然后短信平台再把验证码发送到制定手机号上
3、将手机号验证码、操作时间存入Session中，作为后面验证使用；
4、接收用户填写的验证码、手机号及其他注册数据；
5、对比提交的验证码与Session中的验证码是否一致，同时判断提交动作是否在有效期内；
6、验证码正确且在有效期内，请求通过，处理相应的业务。

前端的页面

jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path;
%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title><script src="<%=basePath %>/view/js/jquery-2.1.1.min.js"></script><script src="<%=basePath %>/view/js/register.js?v=1.0.0"></script><script>function getBasePath(){return '<%=basePath%>';}</script>
</head>
<body><form><div>账号: <input name="userId"></div><div>密码: <input name="password"></div><div>手机号: <input name="number"></div><div>验证码: <input name="verifyCode"><button type="button" class="sendVerifyCode">获取短信验证码</button></div><div><button type="button" class="sub-btn">提交</button></div></form>
</body>
</html>

$(function(){  //发送验证码$(".sendVerifyCode").on("click", function(){var number = $("input[name=number]").val();$.ajax({url: getBasePath()+"/sendSms.html",async : true,type: "post",dataType: "json",data: {"number":number},success: function (data) {if(data == 'fail'){alert("发送验证码失败");return ;}}});}) //提交$(".sub-btn").on("click", function(){var data = {};data.userId = $.trim($("input[name=userId]").val());data.password = $.trim($("input[name=password]").val());data.number = $.trim($("input[name=number]").val());data.verifyCode = $.trim($("input[name=verifyCode]").val());$.ajax({url: getBasePath()+"/register.html",async : true,type: "post",dataType: "json",data: data,success: function (data) {if(data == 'fail'){alert("注册失败");return ;}alert("注册成功");}});})
});

这里省略了所有非空、手机号格式验证

流程：

1)填写手机号

2)获取手机号码，调用sendSms.html接口向手机发送短信验证码

3)用户手机接收到验证码后，将其填写到"验证码"文本框中

后端代码

发送短信验证码

/*** 发送短信验证码* @param number接收手机号码*/@RequestMapping("/sendSms")@ResponseBodypublic Object sendSms(HttpServletRequest request, String number) {try {JSONObject json = null;//生成6位验证码String verifyCode = String.valueOf(new Random().nextInt(899999) + 100000);//发送短信ZhenziSmsClient client = new ZhenziSmsClient("你的appId", "你的appSecret");String result = client.send(number, "您的验证码为:" + verifyCode + "，该码有效期为5分钟，该码只能使用一次！【短信签名】");json = JSONObject.parseObject(result);if(json.getIntValue("code") != 0)//发送短信失败return "fail";//将验证码存到session中,同时存入创建时间//以json存放，这里使用的是阿里的fastjsonHttpSession session = request.getSession();json = new JSONObject();json.put("verifyCode", verifyCode);json.put("createTime", System.currentTimeMillis());// 将认证码存入SESSIONrequest.getSession().setAttribute("verifyCode", json);return "success";} catch (Exception e) {e.printStackTrace();}return null;}

提交注册

/*** 注册*/@RequestMapping("/register")@ResponseBodypublic Object register(HttpServletRequest request, String userId, String password, String number,String verifyCode) {JSONObject json = (JSONObject)request.getSession().getAttribute("verifyCode");if(!json.getString("verifyCode").equals(verifyCode)){return "验证码错误";}if((System.currentTimeMillis() - json.getLong("createTime")) > 1000 * 60 * 5){return "验证码过期";}//将用户信息存入数据库//这里省略return "success";}

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

c语言短信验证码,Web项目中手机注册短信验证码实现的全流程及代码
使用的是榛子云短信平台, 官网地址:http://smsow.zhenzikj.com 后端使用了springMvc,前端用的是jsp + jquery 下载demo: https://downloa ...
最新web/springboot打造通用的短信验证码微服务（详细）
前言很久之前的一篇文章, 最新web/java/jsp实现发送手机短信验证码和邮箱验证码的注册登录功能(详细),截止到目前,依然有很多小伙伴,私信需要帮助,于是我再加一篇,让大家能更好的使用.(当然 ...
手机接收短信验证码生成(纯数字)
手机接收短信验证码生成--纯数字 Random类中的nextInt( )方法 nextInt() 纯数字短信验证码生成 Random类中的nextInt( )方法 nextInt() 不带参数,不带参 ...
SpringBoot 实现手机发送短信验证码
手机发送短信内容一.手机发送短信 1. 前端界面代码 2. UserInfoController 控制器 3. application.properties 配置类文件 4. 具体实现总结内容 ...
java手机验证码登陆_在Web项目中手机短信验证码实现的全过程记录
这篇文章主要给大家介绍了关于在Web项目中实现短信验证码的全过程记录,文中通过示例代码介绍的非常详细,在文末跟大家提供了源码下载,需要的朋友可以参考借鉴,下面随着小编来一起学习学习吧. 前言最近在做 ...
java web短信验证码_在Web项目中手机短信验证码实现的全过程记录
前言最近在做远程智能水表管理系统这个过程有一个功能是在注册页面可以使用手机注册,找了许久才大致了解了手机验证码实现流程,今天在此和大家分享一下.下面话不多说了,来一起看看详细的介绍吧. 短信验证码实 ...
前端接收java验证码_在Web项目中手机短信验证码实现的全过程记录
前言最近在做远程智能水表管理系统这个过程有一个功能是在注册页面可以使用手机注册,找了许久才大致了解了手机验证码实现流程,今天在此和大家分享一下.下面话不多说了,来一起看看详细的介绍吧. 短信验证码实 ...
社交项目实战第一天(短信验证码实现用户登录)
项目实战 <社交项目> 1.功能介绍一乐交友是一个陌生人的在线交友平台,在该平台中可以搜索附近的人,查看好友动态,平台还会通过大数据计算进行智能推荐,通过智能推荐可以找到更加匹配的好友, ...
java 实现手机接收短信验证码功能
需求需要有发送手机短信的平台,这里以阿里云为例.如果没有,就不要试了,不会成功的. 创建一 ...

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

短信验证码实现流程

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

最新文章

热门文章