云悦智销项目06_登录与角色的CRUD
1，密码加密
因为咱们现在的数据库中的密码有很多还有问题，所以我们需要把这个有问题的密码进行统一,以后的新密码也需咱们进行加密
准备MD5Util工具
public class MD5Util {
//系统确定了迭代和盐值，就不会再去修改它
public static final String SALT= "itsource";
public static final Integer HASHITERATIONS= 10;
/**
* 传入密码，咱们对它进行加密
* 统计的加密规则: 加密:MD5 迭代:10 盐值:itsource
* String algorithmName, Object source, Object salt, int hashIterations
* @return
*/
public static String createMd5Str(String pwd) {
SimpleHash hash = new SimpleHash("MD5",pwd,SALT,HASHITERATIONS);
return hash.toString();
}
}
测试中进行修改
//把数据库所有密码进行加密
@Test
public void testUpdatePwd() throws Exception{
//1.拿到所有数据
List<Employee> employeeList = employeeService.findAll();
//2.循环它，修改密码
employeeList.forEach(e->{
//拿到用户名
String username = e.getUsername();
e.setPassword(MD5Util.createMd5Str(username));
employeeService.save(e);
});
}
添加时进行密码加密（EmployeeServiceImpl）
@Override
public void save(Employee employee) {
//对密码进行加密（只对添加的员工的密码加密）
if(employee.getId()==null) {
employee.setPassword(MD5Util.createMd5Str(employee.getPassword()));
}
super.save(employee);
}
2，登录功能
准备登录页面
<%--
Created by IntelliJ IDEA.
User: zhaoyi
Date: 2019/10/19
Time: 下午4:27
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>源码智销系统</title>
<%@ include file="/WEB-INF/views/head.jsp"%>
<script>
function submitForm() {
//直接提交
// 对咱们来说，这是一个Ajax请求
$('#loginForm').form('submit', {
url:"/login",
onSubmit: function(){
return $(this).form('validate');
},
//访问成功后的功能
success:function(data){
//{"success":false,"msg":"用户名错误！"}
//Object { success: false, msg: "用户名或者密码错误！" }
var result = JSON.parse(data);
if(result.success){
//访问成功 -> 跳到主页面(Js怎么跳转)
// location:有很多当前页面的位置信息
// JS的BOM【浏览器对象模型】部分
window.location.href ="/main";
}else{
//访问失败 -> 给出提示
$.messager.alert('错误',result.msg);
}
}
});
}
</script>
</head>
<body>
<div align="center" style="margin-top: 100px;">
<div class="easyui-panel" title="智销系统用户登陆" style="width: 350px; height: 240px;">
<form id="loginForm" class="easyui-form" method="post">
<table align="center" style="margin-top: 15px;">
<tr height="20">
<td>用户名:</td>
</tr>
<tr height="10">
<td><input name="username" class="easyui-validatebox" required="true" value="admin" /></td>
</tr>
<tr height="20">
<td>密 码:</td>
</tr>
<tr height="10">
<td><input name="password" type="password" class="easyui-validatebox" required="true" value="admin" /></td>
</tr>
<tr height="40">
<td align="center"><a href="javascript:;" class="easyui-linkbutton" onclick="submitForm();">登陆</a> <a
href="javascript:;" class="easyui-linkbutton" onclick="resetForm();">重置</a></td>
</tr>
</table>
</form>
</div>
</div>
</body>
</html>
后台的登录支持
根据get与post请求访问不同的方法(RESTful风格)
返回Ajax必需加：@ResponseBody
@Controller
public class LoginController {
/**
* RESTful : 是一种风格
* 一个请求(路径,方式)对应一个资源
*/
@RequestMapping(value = "/login",method= RequestMethod.GET)
public String index(){
return "login";
}
/**
* Ajax请求，应该是返回数据，而不是跳转页面
* 跳转页面:1.报错 2.把跳转到的页面全部传回去
* @return
*/
@RequestMapping(value = "/login",method= RequestMethod.POST)
@ResponseBody
public JsonResult login(String username, String password){
System.out.println(username);
System.out.println(password);
//拿到当前用户(有可能是游客)
Subject subject = SecurityUtils.getSubject();
//直接登录
try {
UsernamePasswordToken token = new UsernamePasswordToken(username,password);
subject.login(token);
} catch (UnknownAccountException e) {
e.printStackTrace();
System.out.println("用户名错误");
return new JsonResult(false,"用户名错误！");
} catch (IncorrectCredentialsException e) {
e.printStackTrace();
System.out.println("密码错误");
return new JsonResult(false,"用户名或者密码错误！");
} catch (AuthenticationException e) {
e.printStackTrace();
System.out.println("神迷错误");
return new JsonResult(false,"神迷错误！");
}
return new JsonResult();
}
@RequestMapping("/logout")
public String logout(){
//完成注销功能
Subject subject = SecurityUtils.getSubject();
subject.logout();
return "redirect:/s/login.jsp";
}
}
3，角色
3.1 Role与Permission的CRUD
3.1.1 domain创建
权限
@Entity
@Table(name = "permission")
public class Permission extends BaseDomain {
//权限名称
private String name;
//权限资源(路径)
private String url;
//描述
private String descs;
//编码
private String sn;
...
}
角色
@Entity
@Table(name = "role")
public class Role extends BaseDomain{
//角色名称
private String name;
//角色编码
private String sn;
/**
* 角色权限是多对多的关系
* JoinTable:配置的是中间表的信息
*/
@ManyToMany
@JoinTable(name = "role_permission",
joinColumns = @JoinColumn(name = "role_id"),
inverseJoinColumns = @JoinColumn(name = "permission_id")
)
private List<Permission> permissions = new ArrayList<>();
//...
}
用户
@Entity
@Table(name = "employee")
public class Employee extends BaseDomain {
...
/**
* 员工与角色是多对多的关系
* JoinTable:配置的是中间表的信息
*/
@ManyToMany
@JoinTable(name = "employee_role",
joinColumns = @JoinColumn(name = "employee_id"),
inverseJoinColumns = @JoinColumn(name = "role_id")
)
private List<Role> roles = new ArrayList<>();
...
}
3.1.2 CV大法
把员工的所有数据拷备一份，进行修改，只留基本的CRUD
项目结构(提高你的开发速度以及找错的速度):Employee,EmployeeQuery,EmployeeRepository,IEmployeeService,EmployeeServiceImpl,EmployeeController,employee/index.jsp,employee.js
4，Role中的Permission的操作
Permission布局 -> layout
左右两个grid
grid的双击事件
点击右边，把这一行交给左边(不能重复)
点击左边，把这一行删除掉
添加时清空，修改时回显
rolePermsGrid.datagrid(“loadData”,本地路径);
回显时权限需要复制 var newPerms = […row.permissions]
提交时权限数据
向后传List/Array: 集合名[索引].属性
设置参数
submit(param)
onSubmit: function(param){
//拼接出相应的权限(List permissions)对应的格式
/**
*SringMVC需要的格式是：
* permissions[0].id = 1
* permissions[1].id = 2
* ...
*/
//1.拿到左边grid的所有值
var rows = rolePermsGrid.datagrid("getRows");
//2.遍历它，拿到每个id
for(var i=0;i<rows.length;i++){
param[`permissions[${i}].id`] = rows[i].id;
}
return $(this).form('validate');
}