好家伙,
xdm,密码验证忘写了,哈哈
bug展示:
1.登陆没有密码验证
主要体现为,乱输也能登进去
(小问题)
要是这么上线估计直接寄了
分析一波密码校验怎么做:
前端输完用户名密码之后,将数据发送到后端处理
后端要做以下几件事
①先确认这个用户名已注册
②我们拿着这个用户名去数据库中找对应的数据,拿到密码
③将前端发过来的密码与后端找到的密码进行比较
对了返回true,不对就false,
返回给前端
完成密码校验
1.来看看登陆这一部分涉及的代码:
SysUserController.java
@PostMapping("login")
public CommonResp login(@RequestBody SysUserLoginReq req){
// zxcv1234
req.setPassword(DigestUtils.md5DigestAsHex(req.getPassword().getBytes()));
CommonResp resp = new CommonResp<>();
SysUserLoginResp loginResp = sysUserService.login(req);
if (loginResp == null) {
resp.setSuccess(false);
}
resp.setContent(loginResp);
return resp;
}
SysUserServicelmpl.java中重写login方法:
@Override
public SysUserLoginResp login(SysUserLoginReq req) {
SysUserEntity userDb = selectByLoginName(req.getLoginName());
QueryWrapper<SysUserEntity> wrapper = new QueryWrapper<>();
if(ObjectUtils.isEmpty(userDb)){
//用户不存在
return null;
}else {
String s1 = userDb.getPassword();
String s2 = req.getPassword();
//进行字符串校验
if(s1.equals(s2)){
//密码验证成功
SysUserLoginResp userLoginResp = CopyUtil.copy(userDb, SysUserLoginResp.class);
return userLoginResp;
}else {
//密码校验失败
return null;
}
}
}
//查询loginName是否被注册
public SysUserEntity selectByLoginName(String loginName){
//QueryWrapper<>()
QueryWrapper<SysUserEntity> wrapper = new QueryWrapper<>();
//wrapper.lambda().eq()单表查询,在"SysUserEntity::getLoginName"找一个指定的"loginName"
wrapper.lambda().eq(SysUserEntity::getLoginName,loginName);
//BaseMapper的selectList()方法,根据id批量查询
List<SysUserEntity> userEntityList = sysUserMapper.selectList(wrapper);
//CollectionUtils.isEmpty()判断集合是否为空
if(CollectionUtils.isEmpty(userEntityList)){
//若判断为空,则返回null,意思是没被注册过
return null;
}else {
//查到了,将这条数据返回
return userEntityList.get(0);
}
}
2.先确认这个用户名已注册
//wrapper.lambda().eq()单表查询,在"SysUserEntity::getLoginName"找一个指定的"loginName"
wrapper.lambda().eq(SysUserEntity::getLoginName,loginName);
lambda表达式看不懂可以点开看一下:
Java Lambda 表达式 | 菜鸟教程 (runoob.com)
3.我们拿着这个用户名去数据库中找对应的数据,拿到密码
//BaseMapper的selectList()方法,根据id批量查询
List<SysUserEntity> userEntityList = sysUserMapper.selectList(wrapper);
//CollectionUtils.isEmpty()判断集合是否为空
if(CollectionUtils.isEmpty(userEntityList)){
//若判断为空,则返回null,意思是没被注册过
return null;
}else {
//查到了,将这条数据返回
return userEntityList.get(0);
}
4.将前端发过来的密码与后端找到的密码进行比较
String s1 = userDb.getPassword();
String s2 = req.getPassword();
//进行字符串校验
if(s1.equals(s2)){
//密码验证成功
SysUserLoginResp userLoginResp = CopyUtil.copy(userDb, SysUserLoginResp.class);
return userLoginResp;
}else {
//密码校验失败
return null;
}
不要写成以下形式,
String a = userDb.getPassword();
String b = req.getPassword();
if(a==b){
SysUserLoginResp userLoginResp = CopyUtil.copy(userDb, SysUserLoginResp.class);
return userLoginResp;
}else {
//密码校验失败
return null;
}
a,b字符串并不指向同一对象,
所以,即使字符串完全相同,a==b也是false
5.前端的校验部分:
作用:防止输入空值无限注册
//表单验证
if (this.loginForm.loginName == "") {
this.$message({
message: '请输入用户名',
type: 'error'
});
return;
}
if (this.loginForm.password == "") {
this.$message({
message: '请输入密码',
type: 'error'
});
return;
}
//发送登陆请求
if (this.loginForm.loginName != "" && this.loginForm.password != "") {
this.axios.post('http://localhost:3312/sys-user/login', this.loginForm).then((resp) => {
console.log(resp);
let data = resp.data;
//
if (data.success) {
this.loginForm = {};
this.$message({
message: '登陆成功!!!',
type: 'success'
});
this.$router.push({ path: '/Home' })
} else {
this.$message({
message: '登陆失败,密码错误或用户名未注册',
type: 'error'
});
console.log(data)
}
})
}
(好烂的写法)
6.效果展示: