云悦智销项目06_登录与角色的CRUD

最新推荐文章于 2022-05-11 16:24:12 发布

RyFit

最新推荐文章于 2022-05-11 16:24:12 发布

阅读量211

点赞数

分类专栏：项目搭建

本文链接：https://blog.csdn.net/qq_45619439/article/details/103572210

版权

项目搭建专栏收录该内容

12 篇文章 0 订阅

订阅专栏

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>密&emsp;码:</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<Permission> 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');
    }