JavaWeb项目实现短信验证码

JavaWeb项目实现短信验证码

二月 29, 2020 阅读数(请刷新)

一、阿里云开通短信服务

阿里云

设置签名

添加短信模板

签名和模板都需要审核,大概两个小时左右(周末也审核)。

获取 用户AccessKey


二、代码

1、pom.xml中添加依赖
1
2
3
4
5
6
7
8
9
10
11
12
13
<!-- 阿里云 -->
<!-- https://mvnrepository.com/artifact/com.aliyun/aliyun-java-sdk-core -->
<dependency>
<groupId>com.aliyun</groupId>
<artifactId>aliyun-java-sdk-core</artifactId>
<version>4.4.3</version>
</dependency>

<dependency>
<groupId>com.aliyun</groupId>
<artifactId>aliyun-java-sdk-dysmsapi</artifactId>
<version>1.1.0</version>
</dependency>
2、创建SendSMSUtil类
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
public class SendSMSUtil {
// 你的accessKeyId
private static final String accessKeyId = "你的accessKeyId";
// 你的accessKeySecret
private static final String accessKeySecret = "你的accessKeySecret";
// 上面设置的签名
private static final String signName = "签名";//
// 短信模板,模板code
private static final String templateCode = "模版CODE";
private static int code;
// phoneNumber必须当做参数传入
public String senSMSUtil(String phoneNumber) {
// 设置超时时间-可自行调整
System.setProperty("sun.net.client.defaultConnectTimeout", "10000");
System.setProperty("sun.net.client.defaultReadTimeout", "10000");

// 初始化ascClient需要的几个参数
final String product = "Dysmsapi";// 短信API产品名称(短信产品名固定,无需修改)
final String domain = "dysmsapi.aliyuncs.com";// 短信API产品域名(接口地址固定,无需修改)


// 初始化ascClient,暂时不支持多region(请勿修改)
IClientProfile profile = DefaultProfile.getProfile("cn-hangzhou", accessKeyId, accessKeySecret);
try {
DefaultProfile.addEndpoint("cn-hangzhou", "cn-hangzhou", product, domain);
} catch (ClientException e) {
e.printStackTrace();
}
IAcsClient acsClient = new DefaultAcsClient(profile);

// 组装请求对象
SendSmsRequest request = new SendSmsRequest();

// 使用post提交
request.setMethod(MethodType.POST);

// 必填:待发送手机号。支持以逗号分隔的形式进行批量调用,批量上限为1000个手机号码,批量调用相对于单条调用及时性稍有延迟,
// 验证码类型的短信推荐使用单条调用的方式;发送国际/港澳台消息时,接收号码格式为国际区号+号码,如“85200000000”
request.setPhoneNumbers(phoneNumber);

request.setSignName(signName);

// 必填:短信模板-可在短信控制台中找到,发送国际/港澳台消息时,请使用国际/港澳台短信模版
request.setTemplateCode(templateCode);

//随机生成六位验证码
code = (int) ((Math.random() * 9 + 1) * 100000);

// 可选:模板中的变量替换JSON串,如模板内容为"亲爱的${name},您的验证码为${code}"时,此处的值为
// 友情提示:如果JSON中需要带换行符,请参照标准的JSON协议对换行符的要求,比如短信内容中包含\r\n的情况在JSON中需要表示成\\r\\n,否则会导致JSON在服务端解析失败
request.setTemplateParam("{code:" + code + "}");

// 请求失败这里会抛ClientException异常
SendSmsResponse sendSmsResponse = null;

try {
sendSmsResponse = acsClient.getAcsResponse(request);
} catch (ClientException e) {
e.printStackTrace();
return "请求失败";
}

assert sendSmsResponse.getCode() != null;
// 获取错误码,如果你账户没钱会返回isv.AMOUNT_NOT_ENOUGH,表示账户没钱,充点钱就行了
System.out.println(sendSmsResponse.getCode());
if (sendSmsResponse.getCode() == null || !sendSmsResponse.getCode().equals("OK")) {// 发送不成功
return sendSmsResponse.getMessage();
}

// 请求成功
return "OK";

}

public int getCode() {
return code;
}


}
3、controller层(Servlet层)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
@RequestMapping("/sendSMS")
public void SendSMS(HttpServletRequest request,HttpServletResponse response) {
PrintWriter out = null;

try {
out = response.getWriter();
} catch (IOException e) {
e.printStackTrace();
}
String phoneNumber = request.getParameter("phone");
System.out.println(phoneNumber);

// 发送短信
SendSMSUtil sendSMS = new SendSMSUtil();
String result = sendSMS.senSMSUtil(phoneNumber);

if (result == null || !result.equals("OK")) {// 发送不成功
System.out.println("失败");
}

// 获取验证码
int code = sendSMS.getCode();
out.print(code);
// 将数据存入SESSION
request.getSession().setAttribute("checkCode", code);
// 将验证码生成时间存入SESSION,若超过五分钟则不通过校验
// 将验证码生成时间存入SESSION,若超过五分钟则不通过校验
request.getSession().setAttribute("createTime", System.currentTimeMillis());
}
// 验证码检测
@RequestMapping("/checkCode")
public void checkCode(HttpServletRequest request, HttpServletResponse response) {
HttpSession session = request.getSession();
response.setContentType("text/html;charset=utf8");
PrintWriter out = null;
try {
out = response.getWriter();
} catch (IOException e) {
e.printStackTrace();
}
String checkCode = request.getParameter("checkCode");
String code = String.valueOf(session.getAttribute("checkCode"));
if (checkCode.equals(code)) {
out.print("验证码正确");
} else {
out.print("验证码错误");
}
}
4、前端HTML

仅做测试用自己完善

1
2
3
4
5
6
7
8
<span>
<input name="code" id="code" style="width: 36%; height: 40px;" type="text"
class="layui-input">
<input class="btn btn-default" id="btn" name="btn" value="发送验证码"
style="width: 45%; height: 33px; margin-right:44px;margin-top:4px;"
onclick="sendMessage()" />
</span>
<p style="color: #ec5042;margin-top:-17px" id="code_msg" ></p>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
<script type="text/javascript">
var InterValObj; //timer变量,控制时间
var count = 60; //间隔函数,1秒执行
var curCount;//当前剩余秒数
var sms = "";
function sendMessage() {
curCount = count;
$("#btn").attr("disabled", "true");
$("#btn").val(curCount + "秒后可重新发送");
InterValObj = window.setInterval(SetRemainTime, 1000); //启动计时器,1秒执行一次请求后台发送验证码 TODO
var phone = $("#phone").val();
var str = "";
if(phone != ""){
if(!(/^1[3456789]\d{9}$/.test(phone))){
str = "手机号错误";
document.getElementById("cphone").innerText=str;

} else{
str = "手机号可用";
document.getElementById("cphone").innerText=str;
// ajax发送验证码请求
$.ajax({
url:"admin/sendSMS?phone="+$("#phone").val(),
success:function(code){
sms=code;
alert(sms);
}
});
}
} else{
str = "手机号不能为空";
document.getElementById("cphone").innerText=str;
}

}
//timer处理函数
function SetRemainTime() {
if (curCount == 0) {
window.clearInterval(InterValObj);//停止计时器
$("#btn").removeAttr("disabled");//启用按钮
$("#btn").val("重新发送验证码");
} else {
curCount--;
$("#btn").val(curCount + "秒后可重新发送");
}
}
// 发送请求验证输入的验证码是否正确
$(function() {
$("#code").blur(function() {
$.ajax({
url : "admin/checkCode?checkCode=" + $("#code").val(),

success : function(code_msg) {
$("#code_msg").html(code_msg);
}
});
});
});
</script>
错误码(第一次很可能就是账户余额不足):



成功