项目演示：
耳听为虚，眼见为实：
SpringMVC整合榛子短信平台实现短信注册和短信发送功能
实现原理
注册与登录功能使用JavaScript实现在一个界面切换展示。用户注册需要使用短信验证的方式确定用户的有效性。用户登录在输入自己的账号和密码后系统自动判定用户的身份进行页面跳转。
用户进入注册界面，需要填写自己等信息，页面会对用户信息格式进行判断。
用户输入手机号后发送验证码，页面将实时刷新验证码时效性。用户通过验证码验证后，系统将用户数据以JSON格式发送至服务器，从而将数据存储进数据库中。
注册功能的时序图
注册功能的程序流程图
用户单击发送验证码后，页面端使用JavaScript获取手机号和发送验证码请求，系统使用AXJA技术将手机号传送给服务器端，之后调用sendSms创建验证码，并将验证码和手机号发送给短信发送平台，系统发送完验证码之后将对应的手机号和验证码记录在JSON。用户在填入验证码提交后系统会取出JSON中的验证码进行验证，通过后将用户数据存进数据库中。
项目代码
导入依赖包：
pom.xml
<!-- 短信推送依赖包 -->
<dependency>
<groupId>com.zhenzikj</groupId>
<artifactId>zhenzisms</artifactId>
<version>1.0.4</version>
</dependency>
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>fastjson</artifactId>
<version>1.2.51</version>
</dependency>
login.jsp
<script src="${pageContext.request.contextPath}/resources/js/register.js" type="text/javascript"></script>
<script>
function getBasePath(){
return '${pageContext.request.contextPath}/Doctor';
}
</script>
<!-- 注册 -->
<div class="register" id ="div2" style="margin-bottom: 0px; padding-top: 10px; padding-top: 0px;">
<h3 style="float: left;margin-top: 0px;margin-bottom: 5px;">请 填 写 相 关 信 息</h3>
<p></p>
<form class="login-form" action="${pageContext.request.contextPath}/Doctor/loginAction" style="margin-bottom:0px;">
<input type="text" name="name" placeholder="姓名" />
<label style="float: left; margin-bottom: 10px; margin-left: 4px;">
<span style="color: black; font-size: 15px">性别：</span>
<input type="radio" name="sex" style="width: 30px; margin-bottom: 2px;" value="男" >男
<input type="radio" name="sex" style="width: 30px; margin-bottom: 2px;" value="女" checked>女
<span style="color: black; font-size: 15px; margin-left: 150px;">年龄：</span>
<select name="age" style="margin-bottom: 2px;">
<option>请选择</option>
<c:forEach var="i" begin="18" end="70">
<!--相当于for(i=6;i<=100;i++) -->
<option value="${i }">${
i }</option>
<!--取i的值 -->
</c:forEach>
</select>
</label>
<input type="text" name="shenfenzhenghao" placeholder="身份证号" />
<input type="text" name="number" placeholder="账号" />
<input type="password" name="password" placeholder="密码" />
<input type="text" name="phone" placeholder="手机号" />
<input type="text" name="verifyCode" style="width: 75%;float:left;" placeholder="验证码" />
<button type="button" class="sendVerifyCode">获取短信验证码</button>
<p style="float:left;margin-bottom: 5px;"><input name="yuedu" value="1" checked type="checkbox" style="width: 20px;float:left;margin-bottom: 5px;margin-top: 5px;">我已阅读《在线导诊用户规范说明书》</p>
<input type="button" value="注 册" style="background: #5C89A2; color: #FFFFFF;" class="sub-btn">
</form>
</div>
regist.js
$(function() {
// 短信验证码倒计时
var countdownHandler = function() {
var $button = $(".sendVerifyCode");
var number = 60;
var countdown = function() {
if (number == 0) {
$button.attr("disabled", false);
$button.html("发送验证码");
number = 60;
return;
} else {
$button.attr("disabled", true);
$button.html(number + "秒 重新发送");
number--;
}
setTimeout(countdown, 1000);
}
setTimeout(countdown, 1000);
}
// 发送短信验证码
$(".sendVerifyCode").on("click", function() {
var $mobile = $("input[name=phone]");
var data = {
};
data.mobile = $.trim($mobile.val());
if (data.mobile == '') {
alert('请输入手机号码');
return;
}
var reg = /^1\d{10}$/;
if (!reg.test(data.mobile)) {
alert('请输入合法的手机号码');
return;
}
$.ajax({
url : getBasePath() + "/sendSms",
async : true,
type : "post",
dataType : "text",
data : data,
success : function(data) {
if (data == 'success') {
countdownHandler();
return;
}
alert(data);
}
});
})
// 提交
$(".sub-btn").on("click", function() {
var data = {
};
data.name = $.trim($("input[name=name]").val());
data.sex = $.trim($("input:radio[name='sex']:checked").val());
data.age = $.trim($("select[name=age]").val());
data.shenfenzhenghao = $.trim($("input[name=shenfenzhenghao]").val());
data.userId = $.trim($("input[name=number]").val());
data.password = $.trim($("input[name=password]").val());
data.mobile = $.trim($("input[name=phone]").val());
data.verifyCode = $.trim($("input[name=verifyCode]").val());
data.yuedu = $.trim($("input:checkbox[name='yuedu']:checked").val());
var reg1=/^\d{17}\d|x$/i;
if (!reg1.test(data.shenfenzhenghao)) {
alert("身份证号格式错误");
return;
}
if (data.shenfenzhenghao == '') {
alert("请输入身份证号");
return;
}
if (data.age == '请选择') {
alert("请选择年龄");
return;
}
if (data.name == '') {
alert("请输入姓名");
return;
}
if (data.userId == '') {
alert("请输入账号");
return;
}
if (data.password == '') {
alert("请输入密码");
return;
}
if (data.mobile == '') {
alert("请输入手机号");
return;
}
if (data.verifyCode == '') {
alert("请输入验证码");
return;
}
if (data.yuedu == '') {
alert("请勾选我同意协议");
return;
}
$.ajax({
url : getBasePath() + "/register",
async : true,
type : "post",
dataType : "text",
data : data,
success : function(data) {
if (data == 'success') {
alert("恭喜，注册成功");
window.location.href=getBasePath() + "/loginpage";
return;
} else if (data == 'mfail') {
alert("手机号错误");
return;
} else if (data == 'cfail') {
alert("验证码错误");
return;
} else if (data == 'tfail') {
alert("验证码过期了");
return;
} else if (data == 'nfail') {
alert("账号重复，请更换账号");
return;
}
alert("系统故障，联系管理员");
}
});
})
});
DoctorContorl.java
@Controller
@RequestMapping("/Doctor")
public class DoctorController {
// 发送信息
@RequestMapping(value ="sendSms")
@ResponseBody
public Object sendSms(HttpServletRequest request, String mobile) {
try {
//生成6位验证码
String verifyCode = String.valueOf(new Random().nextInt(899999) + 100000);
//短信内容
String message="您的验证码为:" + verifyCode + "，该码有效期为5分钟，该码只能使用一次!";
JSONObject json = mu.sendMessage(mobile, message);
if(json.getIntValue("code") != 0)//发送短信失败
return "fail";
//将验证码存到session中,同时存入创建时间
//以json存放，这里使用的是阿里的fastjson
HttpSession session = request.getSession();
json = new JSONObject();
json.put("mobile", mobile);
json.put("verifyCode", verifyCode);
json.put("createTime", System.currentTimeMillis());
// 将认证码存入SESSION
request.getSession().setAttribute("verifyCode", json);
return "success";
} catch (Exception e) {
e.printStackTrace();
}
return null;
}
/**
* 注册
*/
@RequestMapping(value ="register")
@ResponseBody
public Object register(
HttpServletRequest request,
String name,
String sex,
String age,
String shenfenzhenghao,
String userId,
String password,
String mobile,
String verifyCode) {
JSONObject json = (JSONObject)request.getSession().getAttribute("verifyCode");
if(json == null){
return "cfail";
}
if(!json.getString("mobile").equals(mobile)){
return "mfail";
}
if(!json.getString("verifyCode").equals(verifyCode)){
return "cfail";
}
if((System.currentTimeMillis() - json.getLong("createTime")) > 1000 * 60 * 5){
return "tfail";
}
if(la.findByStr(userId)!=null){
return "nfail";
}
//将用户信息存入数据库
int a = Integer.parseInt(age);
DepartmentBean db=da.idShow(1);
UserBean userbean=new UserBean(1,name,sex,a,shenfenzhenghao,mobile,userId,password,-1,0,"","",db,"无");
if(la.insert(userbean)){
return "success";
}
return "fail";
}
}
MessageUtil.java
package cn.doctor.utils;
import java.util.HashMap;
import java.util.Map;
import com.alibaba.fastjson.JSONObject;
import com.zhenzi.sms.ZhenziSmsClient;
public class MessageUtil {
private static String apiUrl = "https://sms_developer.zhenzikj.com";
private static String appId = "ID";
private static String appSecret = "密钥";
private static JSONObject json=null;
public JSONObject sendMessage(String mobile,String message) {
try {
ZhenziSmsClient client = new ZhenziSmsClient(apiUrl, appId, appSecret);
System.out.println("手机号为："+mobile);
System.out.println("内容为为："+message);
Map<String, String> params = new HashMap<String, String>();
params.put("message", message);
params.put("number", mobile);
String result;
result = client.send(params);
json = JSONObject.parseObject(result);
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return json;
}
}
未经授权，请勿转载