SpringBoot:整合layui、退出功能

1、访问Layui官网（https://www.layui.com/），下载模板

（1）以后台作为示例来进行整合

（2）下载代码

（3）在项目中导入静态资源

注意：要将静态资源在shiro的过滤器中设置为不过滤

2、修改下载的layui代码

<!DOCTYPE html>
<html  xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.thymeleaf.org/thymeleaf-extras-shiro">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>SpringBoot整合layui</title>
    <link rel="stylesheet" th:href="@{/layui/css/layui.css}">
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
    <div class="layui-header">
        <div class="layui-logo">layui 后台布局</div>
        <!-- 头部区域（可配合layui已有的水平导航） -->
        <ul class="layui-nav layui-layout-left">
            <li class="layui-nav-item"><a href="">控制台</a></li>
            <li class="layui-nav-item"><a href="">商品管理</a></li>
            <li class="layui-nav-item"><a href="">用户</a></li>
            <li class="layui-nav-item">
                <a href="javascript:;">其它系统</a>
                <dl class="layui-nav-child">
                    <dd><a href="">邮件管理</a></dd>
                    <dd><a href="">消息管理</a></dd>
                    <dd><a href="">授权管理</a></dd>
                </dl>
            </li>
        </ul>
        < class="layui-nav layui-layout-right">
        <shiro:user>
            <li class="layui-nav-item">
                <a href="javascript:;">
                    <img src="http://t.cn/RCzsdCq" class="layui-nav-img">
                    贤心
                </a>
                <dl class="layui-nav-child">
                    <dd><a href="">基本资料</a></dd>
                    <dd><a href="">安全设置</a></dd>
                </dl>
            </li>
            <li class="layui-nav-item"><a href="">退了</a></li>
        </shiro:user>
        <shiro:guest>
            <label style="color: white; text-decoration: underline" onclick="javascript:location.href='login.html'">登录</label>
        </shiro:guest>
        </ul>
    </div>

    <div class="layui-side layui-bg-black">
        <div class="layui-side-scroll">
            <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
            <ul class="layui-nav layui-nav-tree"  lay-filter="test">
                <li class="layui-nav-item layui-nav-itemed">
                    <a class="" href="javascript:;">用户</a>
                    <dl class="layui-nav-child">
                        <dd><a href="javascript:;">学生</a></dd>
                        <dd><a href="javascript:;">教师</a></dd>
                        <dd><a href="javascript:;">管理员</a></dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:;">学生</a>
                    <dl class="layui-nav-child">
                        <shiro:hasPermission name="stu_select"><dd><a href="javascript:;">查询</a></dd></shiro:hasPermission>
                    </dl>

                    <a href="javascript:;">教师</a>
                    <dl class="layui-nav-child">
                        <shiro:hasPermission name="tea_select"><dd><a href="javascript:;">查询</a></dd></shiro:hasPermission>
                        <shiro:hasPermission name="tea_delete"><dd><a href="javascript:;">删除</a></dd></shiro:hasPermission>
                        <shiro:hasPermission name="tea_update"><dd><a href="javascript:;">更新</a></dd></shiro:hasPermission>
                    </dl>


                    <a href="javascript:;">管理员</a>
                    <dl class="layui-nav-child">
                        <shiro:hasPermission name="man_select"><dd><a href="javascript:;">查询</a></dd></shiro:hasPermission>
                        <shiro:hasPermission name="man_delete"><dd><a href="javascript:;">删除</a></dd></shiro:hasPermission>
                        <shiro:hasPermission name="man_update"><dd><a href="javascript:;">更新</a></dd></shiro:hasPermission>
                        <shiro:hasPermission name="man_add"><dd><a href="javascript:;">查询</a></dd></shiro:hasPermission>
                    </dl>
                </li>
            </ul>
        </div>
    </div>

    <div class="layui-body">
        <!-- 内容主体区域 -->
        <div style="padding: 15px;">内容主体区域</div>
    </div>

    <div class="layui-footer">
        <!-- 底部固定区域 -->
        © layui.com - 底部固定区域
    </div>
</div>
<script th:src="@{/layui/layui.js}"></script>
<script>
    //JavaScript代码区域
    layui.use('element', function(){
        var element = layui.element;
    });
</script>
</body>
</html>

引入thymleaf与shiro（此次演示是结合shrio的）

添加shiro的标签，根据用户身份确定在页面要显示的用户权限，根据是否是登录用户确定页面的显示内容

3、测试

（1）学生

（2）教师

（3）管理员

（4）游客访问与登录用户访问

游客访问：

用户访问：

4、退出功能

（1）在shiro过滤器中进行配置

 @Bean//过滤器
    public ShiroFilterFactoryBean shiroFilterFactoryBean(DefaultSecurityManager securityManager) {
        ShiroFilterFactoryBean filter = new ShiroFilterFactoryBean();
        //过滤器是shiro执行权限的核心，进行认证和授权是需要SecurityManager的
        filter.setSecurityManager(securityManager);
        //设置shiro的拦截规则
        Map<String, String> filterMap = new HashMap<>();
        //user：使用remberme的用户可访问
        //perms：对应权限可访问
        //role：对应的角色才能访问
        filterMap.put("/exit", "logout");
        filterMap.put("/", "anon");//anon表示不拦截（匿名用户可访问）
        filterMap.put("/login.html", "anon");
        filterMap.put("/regist.html", "anon");
        filterMap.put("/user/login", "anon");
        filterMap.put("/user/regist", "anon");
        filterMap.put("/static/**", "anon");
        filterMap.put("/layui/**", "anon");
        filterMap.put("/static/layui/css", "anon");
        filterMap.put("/static/layui/js", "anon");
        filterMap.put("/index.html", "anon");
        filterMap.put("/test.html", "anon");
        filterMap.put("/**", "authc");//authc表示认证用户可访问

        filter.setFilterChainDefinitionMap(filterMap);
        filter.setLoginUrl("/login.html");
        //设置未授权访问的页面
        filter.setUnauthorizedUrl("/login.html");
        return filter;
    }

（2）在页面的退出按钮上跳转到退出路径

     <li class="layui-nav-item"><a href="/exit">退了</a></li>

这个过程是不需要书写controller层的