Struct2或者SSH项目中添加手机短信登录及期间遇到的一些问题

关于程序中如何发送短信，可以参考我的上一篇博客，这里就不多陈述了。

一.首先我们从页面看起，主要页面元素如下

<form id="phoneFrom" >
<label for="user-name" class="am-u-sm-3 am-form-label" >手   机 </label>
<input type="text" class="am-form-field" name="phone" id="phoneNum" value="" placeholder="预留手机号...">

<button class="am-btn am-btn-default" type="button" onclick="subform(this)">获取验证码</button>

</form>

<div class="am-input-group am-input-group-sm">
<label for="user-name" class="am-u-sm-3 am-form-label">验证码</label>
<input type="text" class="am-form-field" name="username" id="codeNum" placeholder="输入验证码" >
</div>

<div class="am-modal-footer">
<span class="am-modal-btn" id="submitSpan" >登录</span>
</div>

  JS处理：
<script type="text/javascript">
function subform(obj){
$.ajax({
cache: false,//cache为true则从缓存中取数据，如果数据会变动，则需将此设为false
type: "POST",
url:"${pageContext.request.contextPath}/phoneLogin.action",
data:$('#phoneFrom').serialize(),// 你的formid
async: false,
dataType:"json",//设置需要返回的数据类型
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest.status);
alert(XMLHttpRequest.readyState);
alert(textStatus);
},
success: function(data) {
if("true" == data.result){
var submitSpan = document.getElementById("submitSpan");
//js中动态为标签元素添加点击事件,有如下四种方式，我这里使用了第二种
 /*submitSpan.onclick = function () {
phoneLogin();
} */
submitSpan.onclick = phoneLogin;//后面不能加（）,不然就直接执行该方法了
//submitSpan.attachEvent("onclick",phoneLogin);//Mozilla系列，并不支持该方法，需要用到addEventListener
//submitSpan.addEventListener("onclick", phoneLogin, true);

} else {
alert("该用户不存在，或未绑定手机");

}
}
});
}
function phoneLogin(){
var phone = document.getElementById("phoneNum").value;
var code = document.getElementById("codeNum").value;
var formdata = {
"codeLoginPhone" : phone,
"codeLoginCode" : code
};
$.ajax({
type: "POST",
url: "${pageContext.request.contextPath}/phoneCodeLogin.action",
contentType: "application/json; charset=utf-8",
data: JSON.stringify(formdata),
dataType: "json",
success: function (message) {
if ("true" == message.result) {
//登录验证成功，跳转到主页
var url = "${pageContext.request.contextPath}/mainPage.jsp";
window.location.href=url;
} else {
alert("保存失败");
}
},
error: function (message) {
$("#request-process-patent").html("提交数据失败！");
}
});
}
</script>

二.action中如何处理

   第一步，输入手机号，提交，后台验证用户是否存在，若存在，则发送短信验证码，参数使用ModelDriven方式获取，返回json格式数据，json由map转化而成

/**
* 使用手机号码登录
* @return
* @throws Exception
*/
public String phoneLogin() {
try {
Map<String,Object> map = new HashMap<String,Object>();
String loginPhone = adminKissfly.getPhone();
adminKissfly = adminKissflyService.findAdminByPhone(loginPhone);
//判断登录是否成功
if(adminKissfly==null){
//当前手机号用户不存在，失败
map.put("result","false");
return INPUT;
}else{
//验证码，我这里使用的是四位随机数
String code = RandomUtils.makeRandomNum();
//发送手机短信
Map<String,String> phoneMap = new HashMap<String,String>();
phoneMap.put("phone", loginPhone.trim());
phoneMap.put("text", "验证码：" + code);
String backMes = MessageUtils.SendMessage(phoneMap);
System.out.println("短信发送情况返回码为：" + backMes);
if("1".equals(backMes)){
this.setRequest(ServletActionContext.getRequest());
HttpSession session = request.getSession();
session.setMaxInactiveInterval(60*1);//设置session有效期60秒
session.setAttribute(loginPhone, code);//将验证码放入session中，60秒内有效，用于和用户输入的验证码进行比对
//将数据放在Map中，然后再将Map转化成Json
map.put("result","true");
this.setResult(map);
return "phoneLoginSuccess";
}else{
return INPUT;
}

}

} catch (Exception e) {
e.printStackTrace();
}
return INPUT;
}

    第二步：用户输入验证码并提交，服务器将用户输入的验证码和session中的验证码进行对比，若一致，则登录成功
/**
* 检验验证码是否正确
* @return
*/
public String phoneCodeLogin() {
try {
this.setRequest(ServletActionContext.getRequest());
request.setCharacterEncoding("UTF-8");
ServletInputStream input = request.getInputStream();
int len = request.getContentLength();
if (len <= 0) {
return "";
}
byte[] buffer = new byte[len];
input.read(buffer);
String message = new String(buffer,"UTF-8");

JSONObject allMessage = new JSONObject(message);
String phone = allMessage.getString("codeLoginPhone");
HttpSession session = request.getSession();
String sendCode= (String) session.getAttribute(phone);
String code = allMessage.getString("codeLoginCode");
if(null!=sendCode&&code.equals(sendCode)){
System.out.println("验证码一致，登录通过");
adminKissfly = adminKissflyService.findAdminByPhone(phone);
//判断登录是否成功
if(adminKissfly==null){
//失败
return INPUT;
}else{
//将登录信息保存在session中
 ServletActionContext.getRequest().getSession().setAttribute("adminKissfly", adminKissfly);
Map<String,Object> map = new HashMap<String,Object>();
map.put("result","true");
this.setResult(map);
return "phoneCodeLoginSuccess";
}
}
} catch (Exception e) {
System.out.println(e.getMessage() + e);
e.printStackTrace();
}
return INPUT;
}

三.配置文件的编辑

   Struct.xml的配置

<action name="phoneLogin" class="loginFlyAction" method="phoneLogin">
<result name="phoneLoginSuccess" type="json">
<param name="root">result</param>
</result>
</action>
<action name="phoneCodeLogin" class="loginFlyAction" method="phoneCodeLogin">
<result name="input">/loginFly.jsp</result>
<result name="phoneCodeLoginSuccess" type="json">
<param name="root">result</param>

4000
</result>
</action>