用户管理(3)---密码修改页面呈现、数据持久化实现

以你之姓@ 2023-03-01 09:20 22阅读 0赞

### 文章目录 ###

*   *  十、修改密码页面呈现
     *   *  10.1 服务端关键业务设计及实现
         *  10.2 客户端关键业务设计及实现
         *   *  10.2.1 准备密码编辑页面
             *  10.2.2 密码编辑页面呈现
     *  十一、密码修改页面数据持久化实现
     *   *  11.1 服务端关键业务设计及实现
         *   *  11.1.1 DAO接口定义
             *  11.1.2 Mapper映射文件定义
             *  11.1.3 Service接口定义及实现
             *  11.1.4 Controller类定义
         *  11.2 客户端关键业务设计及实现
     *  十二、总结
     *   *  12.1 重难点分析
         *  12.2 FAQ分析

## 十、修改密码页面呈现 ##

### 10.1 服务端关键业务设计及实现 ###

检查PageController中是否有返回UI页面的方法，有则无需添加。例如：

@RequestMapping("{module}/{moduleUI}")
    public String doModuleUI(@PathVariable String moduleUI) { 
    		return "sys/"+moduleUI;
    }

### 10.2 客户端关键业务设计及实现 ###

#### 10.2.1 准备密码编辑页面 ####

准备密码编辑页面(/templates/pages/sys/pwd\_edit.html)

#### 10.2.2 密码编辑页面呈现 ####

*  **业务描述与设计实现**

在系统首页左侧操作菜单中点击修改密码时，呈现密码编辑页面。

*  **关键代码设计与实现**

在starter.html页面尾部的页面加载完成的事件处理函数中添加事件处理，关键代码如下：

$(function(){ 
         …
         doLoadUI("load-user-id","user/user_list")
    })
    function doLoadUI(id,url){ 
     	$("#"+id).click(function(){ 
        		$("#mainContentId").load(url);
        });
    }

## 十一、密码修改页面数据持久化实现 ##

### 11.1 服务端关键业务设计及实现 ###

#### 11.1.1 DAO接口定义 ####

*  **业务描述及设计实现**

基于用户id，修改用户密码和盐值。

*  **关键代码设计及实现：**

在创建SysUserDao中添加修改用户密码信息的方法。关键代码如下：

int updatePassword(
    		@Param("password")String password,
    		@Param("salt")String salt,
    		@Param("id")Integer id);

#### 11.1.2 Mapper映射文件定义 ####

*  **业务描述及设计实现**

基于用户SysUserDao中修改密码方法的定义，在映射文件中定义映射元素。

*  **关键代码设计及实现：**

在创建SysUserMapper.xml中定义修改密码对应的映射元素。关键代码如下：

<update id="updatePassword">
             update sys_users
             set password=#{ password},
                 salt=#{ salt},
                 modifiedTime=now()
             where id=#{ id}
    </update>

#### 11.1.3 Service接口定义及实现 ####

*  **业务描述及设计实现**

基于控制层提交的用户相关信息，实现修改密码业务。

*  **关键代码设计及实现：**

第一步：在SysUserService接口中添加，用于实现密码修改业务的方法。关键代码如下：

int updatePassword(String password,  
String newPassword,  
String cfgPassword);

第二步：在SysUserService接口的实现类SysUserServiceImpl中添加密码修改业务的具体实现。关键代码如下：

@Override
    	public int updatePassword(String password, String newPassword,
     String cfgPassword) { 
    		//1.判定新密码与密码确认是否相同
    		if(StringUtils.isEmpty(newPassword))
    		throw new IllegalArgumentException("新密码不能为空");
    		if(StringUtils.isEmpty(cfgPassword))
    		throw new IllegalArgumentException("确认密码不能为空");
    		if(!newPassword.equals(cfgPassword))
    		throw new IllegalArgumentException("两次输入的密码不相等");
    		//2.判定原密码是否正确
    		if(StringUtils.isEmpty(password))
    		throw new IllegalArgumentException("原密码不能为空");
    		//获取登陆用户
    		SysUser user=(SysUser)SecurityUtils.getSubject().getPrincipal();
    		SimpleHash sh=new SimpleHash("MD5",
    		password, user.getSalt(), 1);
    		if(!user.getPassword().equals(sh.toHex()))
    		throw new IllegalArgumentException("原密码不正确");
    		//3.对新密码进行加密
    		String salt=UUID.randomUUID().toString();
    		sh=new SimpleHash("MD5",newPassword,salt, 1);
    		//4.将新密码加密以后的结果更新到数据库
    		int rows=sysUserDao.updatePassword(sh.toHex(), salt,user.getId());
    		if(rows==0)
    		throw new ServiceException("修改失败");
    		return rows;
    	}

#### 11.1.4 Controller类定义 ####

*  **业务描述及设计实现**

基于客户端提交的修改密码请求，定义处理请求的相关方法及映射。

*  **关键代码设计及实现：**

在SysUserController类中添加用于实现密码修改的控制层方法。关键代码如下：

@RequestMapping("doUpdatePassword")
    public JsonResult doUpdatePassword(
    			 String pwd,
    			 String newPwd,
    			 String cfgPwd) { 
    		 sysUserService.updatePassword(pwd, newPwd, cfgPwd);
    		 return new JsonResult("update ok");
    }

### 11.2 客户端关键业务设计及实现 ###

*  **业务描述及设计实现**

获取修改页面表单中用户填写的数据，然后向服务端发起异步请求进行数据更新。

*  **关键代码设计及实现：**

第一步：对保存和取消按钮进行事件注册，关键代码如下：

$(function(){ 
    	   $(".box-footer")
    	   .on("click",".btn-cancel",doCancel)
    	   .on("click",".btn-save",doUpdateObject)
       });

第二步：定义保存和取消事件处理函数，关键代码如下：

function doCancel(){ 
    	   $("#mainContentId").html("");
       }
    
       function doUpdateObject(){ 
    	   //1.获取用户提交数据
    	   var params={ pwd:$("#pwdId").val(),
    	              newPwd:$("d").val(),
    	              cfgPwd:$("#cfgPwdId")#newPwdI.val()
    	   }
    	   //2.定义请求的url
    	   var url="user/doUpdatePassword"
    	   //3.异步提交请求,执行更新操作
    	   $.post(url,params,function(result){ 
    			alert(result.message);
    	   })
       }

## 十二、总结 ##

### 12.1 重难点分析 ###

1.  一对多数据的保存?（保存用户信息，保存用户和角色的关系数据)
2.  多对一数据的查询映射?(查询用户时查询用户对应的部门信息)。
3.  用户密码的加密实现？（对用户密码进行MD5盐值加密）

### 12.2 FAQ分析 ###

1.  用户与角色之间是什么关系？(Many2Many)
2.  描述一下用户查询业务的实现？
3.  描述一下用户添加业务的实现？
4.  描述一下用户更新业务的实现？
5.  resultMap元素应用场景？  
    （1）表中字段名与内存中的映射对象属性不一致（set方法不匹配）  
    （2）表关联查询映射，表嵌套查询映射。