手机验证码认证(前台)
用户登录-需要手机下发验证码进行确认
如上图,在登录之后进入首页之前加入验证
前台代码:用到了easyui的架构
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/pages/commons/taglibs.jsp"%>
<html>
<head>
<base href="${basePath}" />
<%@ include file="/WEB-INF/pages/commons/meta.jsp"%>
<title>手机认证</title>
<link rel="stylesheet" type="text/css" href="scripts/jqueryEasyUI/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="scripts/jqueryEasyUI/themes/icon.css">
<style >
body{ font-family:Arial, Helvetica, sans-serif;}
a{text-decoration: none;}
</style>
<script type="text/javascript" src="scripts/jqueryEasyUI/src/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="scripts/jqueryEasyUI/src/jquery.easyui.min1.js"></script>
<script type="text/javascript" src="scripts/jqueryEasyUI/src/jquery.easyui.min.js"></script>
<script type="text/javascript" src="scripts/jqueryEasyUI/src/jquery.datagrid.js"></script>
<script type="text/javascript">
$(function(){
var dlg = $('#dlg1').dialog({
width:350,
height:265,
modal:true,
buttons:{
'确定':function(){
$('#lo').attr('action','user/liceLogin');
$('#lo').submit();
return false;
}
}
});
});
function open1(){
$('#dlg1').dialog({
showType:null
});
}
</script>
<script type="text/javascript">
$(function(){
var ci = "${num}";
if(ci != 5){
document.getElementById("pass").style.display = 'block';
}
});
</script>
<script language="javascript">
var wait = "${times}";
//设置秒数(单位秒)
var i = 0;
var iid = 0;
iid = setInterval("sTimer()",1000);
function sTimer() {
var r=wait-i;
if(r==0) {
clearInterval(iid);
document.getElementById("BtnOk").value=" 重新获取";
document.getElementById("BtnOk").disabled=false; }
else {
document.getElementById("BtnOk").value="("+r+")秒之后可重新获取";
i++;
}
}
</script>
<script type="text/javascript">
function agSendCode(){
$('#lo').attr('action','user/agSendPhoneCode');
$('#lo').submit();
}
</script>
</head>
<body style=" padding:0; margin:0; font-size:12px">
<div id="dlg1" title="手机认证" style="width:420px;">
<div style="padding:20px;">
<div><form action="user/liceLogin" id="lo">
<div><a>为了您的帐户安全,请先进行安全认证。</a><br /><br /> </div>
<div><a>您认证的安全手机为:${m3}****${m4 }</a></div>
<div> <br />验证码:<input id="code" name="code" size="6"/> <input size="7" id="BtnOk" type="button" disabled="disabled" value="90秒之后可重新获取" onclick="agSendCode()"></input></div>
<div>
<div id="pass" style="display:none" > <a style="color: red;">输入错误:你还有${num }次机会,输错五次账户将锁定</a></div>
<input id="num" name="num" type="hidden" value="${num }">
</div>
</form>
</div>
</div>
</div>
</body>
</html>
后台直接调用一个发短信的方法,这里就不列出了