日期:2014-05-16  浏览次数:20419 次

使用Nutz的json视图实现前台密码验证

使用Nutz的json视图实现前台密码验证

?

?

【阅读本文前提】

?

??? 您了解Nutz框架(刚刚接触Nutz,对此还不熟悉),想要使用json视图;

??? 您对jquery的ajax还不熟悉,想要使用此功能;

??? 您使用了MD5加密了原始密码,或者其他方式加密了原始密码,在修改密码时候需要先把用户输入的原始密码传到后台,在进行加密,与数据库中的密码判断,如果相同,传回到页面。

?

【正文】

?

? 1.怎么在项目中使用Nutz框架,这里就不说了,具体可查看:

???? http://code.google.com/p/nutz/wiki/nutz_preface?tm=6

??

?? 2.前台修改密码部分

?

?? 修改密码的页面的代码为(我使用了FreeMarker视图,但对功能实现不影响,您也可用其他视图):

?

<form name="theForm" action="" method="post">
<input type="hidden" name="personId" value="aa" />
<table width="95%" border="0" cellPadding="0" cellSpacing="1" bgcolor="#6386d6">
  <tr bgcolor="#EFF3F7" class="TableBody1">
      <td width="35%" height="37" align="right"><b>登录名:</b></td>
      <td height="37" align="left">${Session[config.session_user].loginName}</td>
  </tr>
  <tr bgcolor="#EFF3F7" class="TableBody1">
      <td width="35%" height="37" align="right"><b>用户名:</b></td>
      <td height="37" align="left">${Session[config.session_user].userName}</td>
  </tr>
  <tr bgcolor="#EFF3F7" class="TableBody1">
      <td width="35%" height="37" align="right"><b>原始密码:</b></td>
      <td height="37" align="left">
      	<input type="password" name="oldpassword" value="" />
      </td>
  </tr>
  <tr bgcolor="#EFF3F7" class="TableBody1">
      <td width="35%" height="37" align="right"><b>新密码:</b></td>
      <td height="37" align="left">
      	<input type="password" name="password" value="" />
      </td>
  </tr>
  <tr bgcolor="#EFF3F7" class="TableBody1">
      <td width="35%" height="37" align="right"><b>重复密码:</b></td>
      <td height="37" align="left">
      	<input type="password" name="repassword" value="" />
      </td>
  </tr>
  <tr bgcolor="#EFF3F7" class="TableBody1">
      <td width="35%" height="37" align="center"></td>
      <td height="37" align="left">
      	<input class="mya" type="button" value="确定" onclick="return validateForm();" />
      	<input class="mya" type="reset" value="重置" />
      </td>
  </tr>
</table>
</form>

?

js代码(我直接写在了页面上):

?

<script type="text/javascript">
<!--
	function validateForm(){
		var oldpassword = theForm.oldpassword;
		var password = theForm.password;
		var repassword = theForm.repassword;
		var obj = false;
                                
                                。。。。。。
                    	$.ajax({
			async:false, //使用同步请求,因为异步请求不能将返回值传给全局变量;这里很重要
			url:"${base}/admin/validate.action",
			type:"post",
			dataType:"json",
			data:"oldPwd="+oldpassword.value,
			success:function(data){
			   // alert("ok:"+data);
			    obj = data;
			}
		});
		
		 if(!obj){
			alert("请输入正确的原始密码!");
			oldpassword.value="";
			oldpassword.focus();
			return false;
		}
                                。。。。。。
//-->
</script>

?

其中。。。。。。是略掉了其他代码,对此功能实现无影响。

?

?

到这里,解释下:

?

用户在页面上输入了原始密码,比如是:admin,在js代码里面使用了jquery的ajax进行与后台交互

其中的 async:false 这个设置很重要

URL地址就是在后台的一个子模块的一个入口函数(就像struts2里面的action)

?

3.后台部分

?

在相关的模块里面的相关入口函数validate的代码:

?

/**
* 前台密码验证
* @return
 */
@At("/admin/validate")
@Ok("json")
public boolean validate(@Param("oldPwd")String oldPwd,HttpServletRequest req){
			
	User user = (User)req.getSession().getAttribute(Constants.LOGIN_USER);
	boolean flag = MD5Util.checkMD5String(oldPwd, user.getPassword());

	return flag;
}