文章目录
1 点击修改密码跳转
1.1 前端加入注解/user/updatePwd
<li><a href="/user/updatePwd">修改密码</a></li>
1.2 跳转到密码修改页面
UserController类里：
//跳转到密码修改页面
@GetMapping("/updatePwd")
public String updatePwd(){
return "web/password";
}
2 检查原密码
2.1 前端ajax传原密码
给原密码输入框添加 id=“oldPwd”
添加span标签span id=“sp1”
前端password.html：
<script>
$(document).ready(function (){
checkOldPassword();
})
function checkOldPassword(){
//给原密码输入框添加失去焦点事件
$("#oldPwd").blur(function () {
var oldPassword = $("#oldPwd").val();
if (oldPassword == null || oldPassword === '') {
alert("原密码不能为空！");
return;
}
//发送ajax请求
$.post("/user/checkOldPassword",{"oldPassword":oldPassword},function (data){
if (data.state == 1) {
$("#sp1").html(data.message);
$("#sp1").css("color", "green");
} else {
$("#sp1").html(data.message);
$("#sp1").css("color", "red");
}
},"json");
});
}
</script>
2.2 UserController类/user/checkOldPassword
通过注解/user/checkOldPassword跳转到服务端UserController类：
//检查原密码
@PostMapping("/checkOldPassword")
@ResponseBody
public JsonResult checkOldPassword(String oldPassword,HttpServletRequest request){
HttpSession session = request.getSession();
Integer uid = (Integer) session.getAttribute("uid");
User user = userService.findUserByUid(oldPassword,uid);
//因为前端页面没有用到user对象的数据，可以不将user的数据转成json格式返回给前端
return new JsonResult(1,"原密码验证通过");
}
2.3 UserMapper.java和UserMapper.xml里的findUserByUid
用户模块持久层接口UserMapper.java
//检查原密码，需要根据当前uid查询当前数据信息
User findUserByUid(@Param("uid") Integer uid);
UserMapper.xml
<!--根据uid查询当前用户信息-->
<select id="findUserByUid" resultType="User">
select uid,username,password,salt,is_delete isDelete from tb_user
where uid=#{uid}
</select>
2.4 用户模块的业务层
用户模块的业务层接口userService的findUserByUid(oldPassword,uid)
//根据uid查询当前用户信息
User findUserByUid(String oldPassword,Integer uid);
业务层UserServiceImpl implements UserService
@Override
public User findUserByUid(String oldPassword,Integer uid){
//对参数的判断
if (oldPassword == null||StringUtils.isEmpty(oldPassword)){
throw new ServiceException("原密码不能为空");
}
if (uid == null){
throw new ServiceException("会话超时，请重新登录！");
}
User user = userMapper.findUserByUid(uid);
if (user == null) {
throw new ServiceException("数据可能被管理员删除！");
}
if (user.getIsDelete() == 1) {
throw new ServiceException("数据可能被管理员删除！");
}
String salt = user.getSalt();
String password = user.getPassword();
//将oldPassword 和 salt 加密
String md5PWD = getMd5PWD(oldPassword,salt);
if (!md5PWD.equals(password)){
throw new ServiceException("原密码错误！");
}
return user;
}
2.5 效果
3 检查新密码和确认密码是否一致
3.1 前端
给新密码添加id=“newPwd”
确认密码添加id=“confirmPwd”
确认密码下添加span标签span id=“sp2”
在$(document).ready(function (){ })里添加函数checkNewAndConformPwd();
函数checkNewAndConformPwd()：
function checkNewAndConformPwd(){
//给确认密码添加失去焦点事件
$("#confirmPwd").blur(function (){
var newPwd = $("#newPwd").val();
var confirmPwd = $("#confirmPwd").val();
if (newPwd != confirmPwd){
$("#sp2").html("两次密码输入不一致");
$("#sp2").css("color", "red");
}else {
$("#sp2").html("两次密码输入验证通过");
$("#sp2").css("color", "green");
}
});
}
3.2 效果
4 执行修改密码
4.1 前端
给修改按钮条件id=“updateBtn”
在$(document).ready(function (){ })里添加函数doUpdatePwd();
函数doUpdatePwd()：
function doUpdatePwd(){
//给修改按钮添加事件
$("#updateBtn").click(function (){
//再一次对表单数据进行有效验证
var oldPwd = $("#oldPwd").val();
var newPwd = $("#newPwd").val()
var confirmPwd = $("#confirmPwd").val();
if (oldPwd == null || oldPwd ===''){
alert("原密码不能为空")
return ;
}
if (newPwd == null || newPwd ===''){
alert("新密码不能为空")
return ;
}
if (confirmPwd == null || confirmPwd ===''){
alert("确认密码不能为空")
return ;
}
//发送ajax请求
$.post("/user/doUpdatePwd",{"newPwd":newPwd},function (data){
if (data.state == 1){
alert(data.message);
//清空localStorage绑定的数据
localStorage.clear();
//密码修改成功跳转登录页面
location.href="/user/login";
}else {
alert(data.message);
}
},"json");
});
}
4.2 UserController类/user/doUpdatePwd
通过注解/user/doUpdatePwd跳转到服务端UserController类：
//执行密码更新
@PostMapping("/doUpdatePwd")
@ResponseBody
public JsonResult doUpdatePwd(String newPwd,HttpSession session){
Integer uid = (Integer) session.getAttribute("uid");
int row = userService.updatePwd(uid,newPwd);
return new JsonResult(1,"密码更新成功");
}
4.3 UserMapper.java和UserMapper.xml里的updatePassword
用户模块持久层接口UserMapper.java
//增删改 返回值 受影响的行数
int updatePassword(@Param("uid") Integer uid,
@Param("newPwd") String newPwd,
@Param("salt") String salt,
@Param("modifyUser") String modifyUser);
UserMapper.xml
<!--根据uid执行更新操作-->
<update id="updatePassword">
update tb_user set password=#{newPwd},salt=#{salt},modified_User=#{modifyUser},
modifyTime=now() where uid=#{uid}
</update>
4.4 用户模块的业务层
用户模块的业务层接口userServiced的updatePwd(uid,newPwd)
//执行密码更新操作
int updatePwd(Integer uid,String newPwd);
业务层UserServiceImpl implements UserService
@Override
public int updatePwd(Integer uid,String newPwd){
//对参数判断
if (uid == null){
throw new ServiceException("会话超时，请重新登录！");
}
if (newPwd == null||StringUtils.isEmpty(newPwd)){
throw new ServiceException("新密码不能为空");
}
//根据uid查找当前用户信息，找到username
User user = userMapper.findUserByUid(uid);
//找到用户名
String username = user.getUsername();
//生成一个盐值
String salt = UUID.randomUUID().toString();
//加密
String md5PWD = getMd5PWD(newPwd,salt);
int row = userMapper.updatePassword(uid,md5PWD,salt,username);
if (row<0){
throw new ServiceException("更新密码失败！");
}
return row;
}