手机短信验证码

包括手机验证码的发送还有点击后倒计时及验证码的验证包括验证码是否输入正确和是否在规定时间间内
jsp

<input onclick="settime(this);"  type="button"  value="获取验证码" style="width: 53%;height: 30px;background: #beaca4;;text-align:center;padding-right: 1px;"><br>

在这里插入图片描述

<script language="javascript" type="text/javascript">
//发送验证码
function settime(val) {
	var phone = $('#phone').val();
	var myreg="/(^\d{15}$)|(^\d{17}(x|X|\d)$)/";
	   if (phone == null || phone == '') {
	    	top.layer.msg("手机号不能为空！", {icon: 5});
       }else{
   		$.ajax({
   			type:"post",
   			url:"xxx/xxx.do",
   			dataType:"json",
   			data:{ "phone":phone },
   			success:function(msg){
   				if(msg.code == 1){
   					top.layer.msg("验证码发送成功！", {icon: 6});
   				}else{
 						top.layer.msg(msg.msg, {icon: 5});
 				}
   			}
   		})
       	time(val);
       }
} 
//倒计时
var countdown = 60;
function time(val) {
	if (countdown == 0) {
		val.removeAttribute("disabled");
		val.value = "获取验证码";
		countdown = 60;
		return false;
	} else {
		val.setAttribute("disabled", true);
		val.value = "重新发送(" + countdown + ")";
		countdown--;
	}
	setTimeout(function() {
		time(val);
	}, 1000);	 
}
	
</script>

通过input 框里的onclick="settime(this);"方法发送验证码结尾运行 time(val);方法进行倒计时
在这里插入图片描述

接下来通过ajax到后台
我是通过"容联云通讯" 来进行短信的发送的
如果你们不是那前台能用后台就886

utils

package xxx.utils;

import java.util.HashMap;
import java.util.Map;
import java.util.Set;

import com.cloopen.rest.sdk.CCPRestSmsSDK;

/**短信验证码发送
 * @author lenovo
 *
 */
public class SMSUtil {

	private static CCPRestSmsSDK restAPI = null;
	
	static{
	  //这些事一些短信模板的id 和发送短信的Account
		restAPI = new CCPRestSmsSDK();
		restAPI.init("app.cloopen.com", "8883");
		restAPI.setAccount("xxx", "xxx");
		restAPI.setAppId("xxx");
	}
	
	/**
	 * @Method phone 手机号 Verification 验证码
	 * @author xxx
	 * @createTime 2018年9月14日 上午9:32:01
	 */
	public static void send(String phone,String Verification ){
		Map<String,Object> result = restAPI.sendTemplateSMS(phone,"147071" ,new String[]{Verification,"2"});
		System.out.println("手机号"+phone);
		System.out.println("验证码"+Verification);
		if("000000".equals(result.get("statusCode"))){
			//正常返回输出data包体信息（map）
			HashMap<String,Object> data = (HashMap<String, Object>) result.get("data");
			Set<String> keySet = data.keySet();
			for(String key:keySet){
				Object object = data.get(key);
				System.out.println(key +" = "+object);
			}
		}else{
			//异常返回输出错误码和错误信息
			System.out.println("错误码=" + result.get("statusCode") +" 错误信息= "+result.get("statusMsg"));
		}
	}
}

下面到Controller层

/**
	 * @Method 发送短信验证码
	 * @author xxx
	 * @createTime xxx 上午9:47:26
	 */
	@RequestMapping(value="message")
	@ResponseBody
	public JsonBean sms(HttpServletRequest request,String phone){
		JsonBean jsonBean = new JsonBean(1, "验证码发送成功", null);
        Random random = new Random();
        //随机一个6位数的验证码
		String Verification="";
		for (int i=0;i<6;i++)
		{
			Verification+=random.nextInt(10);
		}
		 SMSUtil.send(phone, Verification);//第一个参数是前台传过来的手机号  第二个是验证码
		 Date date = new Date();
		 SimpleDateFormat time = new SimpleDateFormat("yyyyMMddHHmmss");
		 // 我的缓存是shiro做的 session里边存的是验证码  和当前时间 
	   SecurityUtils.getSubject().getSession().setAttribute(Verification, time.format(date));
	   System.out.println("值"+SecurityUtils.getSubject().getSession().getAttribute(Verification));
	   return jsonBean;
	}

到这短信验证码的发送就成功啦

下边就该验证啦
用户点击注册通过ajax 将验证码传到后台进行验证码是否正确
ajax 就不粘了

@ResponseBody
	@RequestMapping(value = "registerTeacher")
	public JsonBean register(AdmissionsTeacher admissionsTeacher  ,String Verification) throws ClientProtocolException, IOException, ParseException{
		//验证码是否输入正确
		//session通过验证码获取当前时间 为空就是验证码输入错误
		String Verifications = (String) SecurityUtils.getSubject().getSession().getAttribute(Verification);
		if(Verifications == null){
			JsonBean jsonBean = new JsonBean(0, "验证码输入错误", null);
			return jsonBean;
		}
		//验证码是否在60秒之内
		//session通过验证码获取当前时间 不为空
		//获取当前时间
		 Date date = new Date();
		 SimpleDateFormat time = new SimpleDateFormat("yyyyMMddHHmmss");

		Date parse = time.parse(Verifications);
	    Date dates = time.parse(time.format(date));
	    System.out.println(Verifications);
	    System.out.println(time.format(date));
	    long a = dates.getTime();
	    long b = parse.getTime();
	    
	    int s = (int)((a - b) / 1000);
		System.out.println(s+"秒");
		//当前时间减去从session取出来的时间大于60秒则验证码超时
		if(s > 60){
			JsonBean jsonBean = new JsonBean(0, "验证码输入超时", null);
			return jsonBean;
		}
		//如果小于60秒则通过验证 添加用户
		
		//下边是我业务逻辑就不粘了
	
		return jsonBean;
	}

到这短信的发送及验证的一套流程就结束了

手机短信验证码

手机短信验证码

猜你喜欢