springMVC中web短信验证码校验

最新推荐文章于 2021-10-19 00:46:27 发布

tyt叮当tyt

最新推荐文章于 2021-10-19 00:46:27 发布

阅读量1w

点赞数 3

分类专栏： Java Web

本文链接：https://blog.csdn.net/suwing6406029/article/details/38462625

版权

Java Web 专栏收录该内容

29 篇文章 0 订阅

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
</head>
<body οnlοad="checkTime();">
	<div align="center">
		<div>
			<form id="validateForm" action="validate.html">
				<div>手机号：<input id="phone" type="text" name="phone" value="" maxlength="11"/></div>
				<div>验证码：<input type="text" name="code"><button id="validationCode" type="button" οnclick="sendCode(this);" title="获取验证码">获取验证码</button></div>
				<div><button type="button" οnclick="doValidation();" title="提交">提交</button></div>
			</form>
		</div>
	</div>
</body>
</html>

<script type="text/javascript">
	function sendCode(obj){
		var phone = document.getElementById("phone");
		var value = phone.value.trim();
		if(value && value.length == 11){
			$.ajax({
				cache : false,
				url : "sendCode.html",
				data : {phone : value}
			});
			// 1分钟内禁止点击
			for (var i = 1; i <= 60; i++) {
				// 1秒后显示
				window.setTimeout("updateTime(" + (60 - i) + ")", i * 1000);
			}
		}else{
			alert("请输入正确的手机号码");
			phone.focus();
			
		}
	}
	
	function updateTime(i){
		// setTimeout传多个参数到function有点麻烦，只能重新获取对象
		var obj = document.getElementById("validationCode");
		if(i > 0){
			obj.innerHTML  = "距离下次获取还有" + i + "秒";
			obj.disabled = true;
		}else{
			obj.innerHTML = "获取验证码";
			obj.disabled = false;
		}
	}
	
	function checkTime(){
		var sendCodeTime = <%=(Long)session.getAttribute("SEND_CODE_TIME")%>;
		if(sendCodeTime){
			var nowTime = new Date().getTime();
			var flag = Math.floor((nowTime - sendCodeTime)/1000);
			if(flag < 60){
				var end = 60 - flag;
				// 进页面马上开始，选i为0
				for (var i = 0; i <= end; i++) {
					window.setTimeout("updateTime(" + (end - i) + ")", i * 1000);
				}
			}
		}
	}
	
	function doValidation(){
		if(validateFormValidateor.form()){
			$("#validateForm").ajaxSubmit({
	            success:function(data){
	            	if(data == "success") {
	                	alert("验证成功");
	                }else{
	                	alert("验证失败");
	                }
	            }
	         });
		}
	}
	
	var validateFormValidateor;
	$().ready(function(){
		validateFormValidateor = $("#validateForm").validate({
			rules:{
				phone:{
					required:true,
					number:true,
					minlength:11
				},
				code:"required"
			},
			messages:{
				phone:{
					required: "请输入手机号码",
					number: "只能输入数字",
					minlength: "手机号码为11位"
				}
			}
		});
	});
</script>

@Controller
@RequestMapping("/phone")
public class PhoneController {
	
	private static final String VALIDATE_PHONE_CODE = "VALIDATE_PHONE_CODE";
	private static final String VALIDATE_PHONE = "VALIDATE_PHONE";
	private static final String SEND_CODE_TIME = "SEND_CODE_TIME";
	
	@RequestMapping("index.html")
	protected String index() {
		return "phone/list";
	}
	
	@RequestMapping("sendCode.html")
	@ResponseBody
	protected void sendCode(String phone, HttpServletRequest request) throws HttpException, IOException {
		StringBuilder code = new StringBuilder();
		Random random = new Random();
		// 6位验证码
		for (int i = 0; i < 6; i++) {
			code.append(String.valueOf(random.nextInt(10)));
		}
		HttpSession session = request.getSession();
		session.setAttribute(VALIDATE_PHONE, phone);
		session.setAttribute(VALIDATE_PHONE_CODE, code.toString());
		session.setAttribute(SEND_CODE_TIME, new Date().getTime());
		String smsText = "验证码：" + code;
		System.out.println("手机号：" + phone + ", " + smsText);
		SendMsg_webchinese.sendMessage(phone, smsText);
	}
	
	@RequestMapping("validate.html")
	@ResponseBody
	protected String validate(HttpServletRequest request){
		HttpSession session = request.getSession();
		String code = (String) session.getAttribute(VALIDATE_PHONE_CODE);
		String phone = (String) session.getAttribute(VALIDATE_PHONE);
		String inputCode = request.getParameter("code");
		String inputPhone = request.getParameter("phone");
		if(phone.equals(inputPhone) && code.equalsIgnoreCase(inputCode)){
			return "success";
		}else{
			return "failure";
		}
	}
}

import java.io.IOException;
import java.io.UnsupportedEncodingException;

import org.apache.commons.httpclient.Header;
import org.apache.commons.httpclient.HttpClient;
import org.apache.commons.httpclient.HttpException;
import org.apache.commons.httpclient.NameValuePair;
import org.apache.commons.httpclient.methods.PostMethod;

public class SendMsg_webchinese {

	public static final String UID = "123";
	public static final String KEY = "123456";
	public static final String SMS_SEND_URI = "http://utf8.sms.webchinese.cn";
	public static final String SMS_NUM_URI = "http://sms.webchinese.cn/web_api/SMS/?Action=SMS_Num";
	
	// 发送短信
	public static int sendMessage(String phone, String smsText) throws HttpException, IOException{
		PostMethod post = new PostMethod(SMS_SEND_URI);
		NameValuePair[] data = { new NameValuePair("Uid", UID),
				new NameValuePair("Key", KEY),
				new NameValuePair("smsMob", phone),
				new NameValuePair("smsText", smsText) };
		String result = executeMethod(post, data);
		System.out.println("发送短信数量：" + result + "，手机号：" + phone + "信息：" + smsText);
		post.releaseConnection();
		return Integer.parseInt(result);
	}
	
	// 获取短信数量
	public static int smsNum() throws UnsupportedEncodingException, IOException{
		PostMethod post = new PostMethod(SMS_NUM_URI);
		NameValuePair[] data = { new NameValuePair("Uid", UID), new NameValuePair("Key", KEY) };
		String result = executeMethod(post, data);
		System.out.println("短信数量：" + result);
		post.releaseConnection();
		return Integer.parseInt(result);
	}
	
	private static String executeMethod(PostMethod post, NameValuePair[] data) throws HttpException, IOException{
		post.addRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8");
		post.setRequestBody(data);
		HttpClient client = new HttpClient();
		client.executeMethod(post);
		Header[] headers = post.getResponseHeaders();
		int statusCode = post.getStatusCode();
		System.out.println("statusCode:" + statusCode);
		for (Header h : headers) {
			System.out.println(h.toString());
		}
		return new String(post.getResponseBodyAsString().getBytes("utf-8"));
	}
}

短信发送的包可以在参考里的短信发送连接里下，UID和KEY是在里面注册的。

参考：页面短信发送 setTimeout参数传递

tyt叮当tyt

关注

3
点赞
踩
19

收藏

觉得还不错? 一键收藏
3
评论
springMVC中web短信验证码校验

手机号：验证码：获取验证码提交 function sendCode(obj){ var phone = document.getElementById("phone"); var value = phone.value.trim(); if(value && value.length == 11){ $.ajax({ cache
复制链接

扫一扫