目录JAVA全系列 教程
3762个小节阅读：7092.4k
目录
C语言快速入门
JAVA全系列 教程
面向对象的程序设计语言
Python全系列 教程
Python3.x版本，未来主流的版本
人工智能 教程
顺势而为，AI创新未来
大厂算法 教程
算法，程序员自我提升必经之路
C++ 教程
一门通用计算机编程语言
微服务 教程
目前业界流行的框架组合
web前端全系列 教程
通向WEB技术世界的钥匙
大数据全系列 教程
站在云端操控万千数据
AIGC全能工具班
A A
White Night
在开发中，用户如果没有权限，我们往往会将页面上的内容隐藏。此时需要Thymeleaf整合Spring Security进行前端鉴权。
修改common_aside.html，添加thymeleaf-springsecurity命名空间
xxxxxxxxxx<html xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity5">修改common_aside.html，加入security标签进行前端鉴权
xxxxxxxxxx<!-- sidebar menu: : style can be found in sidebar.less --><ul class="sidebar-menu"> <li class="header">菜单</li> <li id="admin-index"><a href="/backstage/index"><i class="fa fa-dashboard"></i> <span>首页</span></a></li> <li class="treeview" id="system"> <a href="#"> <i class="fa fa-folder"></i> <span>系统管理</span> <span class="pull-right-container"> <i class="fa fa-angle-left pull-right"></i> </span> </a> <ul class="treeview-menu"> <li id="admin" sec:authorize="hasAnyAuthority('/admin/all')"> <a href="/backstage/admin/all"> <i class="fa fa-circle-o"></i>用户管理 </a> </li> <li id="role" sec:authorize="hasAnyAuthority('/role/all')"> <a href="/backstage/role/all"> <i class="fa fa-circle-o"></i>角色管理 </a> </li> <li id="permission" sec:authorize="hasAnyAuthority('/permission/all')"> <a href="/backstage/permission/all"> <i class="fa fa-circle-o"></i>权限管理 </a> </li> </ul> </li> <li class="treeview" id="business"> <a href="#"> <i class="fa fa-laptop"></i> <span>业务管理</span> <span class="pull-right-container"> <i class="fa fa-angle-left pull-right"></i> </span> </a> <ul class="treeview-menu"> <li id="category"> <a href="/backstage/category/all"> <i class="fa fa-circle-o"></i>类型管理 </a> </li> </ul> <ul class="treeview-menu"> <li id="product"> <a href="/backstage/product/all"> <i class="fa fa-circle-o"></i>产品管理 </a> </li> </ul> </li></ul>修改permission_all.html，给新建按钮进行鉴权配置
xxxxxxxxxx<!DOCTYPE html><html xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity5"><head> <title>权限管理</title> <th:block th:replace="/backstage/common_resources::common_css"/> <th:block th:replace="/backstage/common_resources::common_js"/></head><body class="hold-transition skin-purple sidebar-mini"><div class="wrapper"> <!-- 页面头部 --> <header th:replace="~{/backstage/common_header::header}"></header> <!-- 导航侧栏 --> <aside th:replace="~{/backstage/common_aside::aside}"></aside> <!-- 内容区域 --> <div class="content-wrapper"> <!-- 内容头部 --> <section class="content-header"> <h1> 权限管理 <small>全部权限</small> </h1> <ol class="breadcrumb"> <li><a th:href="@{/backstage/index}"><i class="fa fa-dashboard"></i> 首页</a></li> <li><a th:href="@{/backstage/permission/all}">权限管理</a></li> <li class="active">全部权限</li> </ol> </section> <!-- 内容头部 /--> <!-- 正文区域 --> <section class="content"> <!-- .box-body --> <div class="box box-primary"> <div class="box-header with-border"> <h3 class="box-title">列表</h3> </div> <div class="box-body"> <!-- 数据表格 --> <div class="table-box"> <!--工具栏--> <div class="pull-left"> <div class="form-group form-inline"> <div class="btn-group"> <a th:href="@{/backstage/permission_add}"> <button type="button" class="btn btn-default" title="新建" sec:authorize="hasAnyAuthority('/permission/add')"> <i class="fa fa-file-o"></i> 新建 </button> </a> </div> </div> </div> <!--数据列表--> <table id="dataList" class="table table-bordered table-striped table-hover dataTable"> <thead> <tr> <th></th> <th>权限名</th> <th>权限详情</th> <th class="text-center">操作</th> </tr> </thead> <tbody> <tr th:each="permission:${permissionPage.records}"> <td><input name="ids" type="checkbox" value="${permission.pid}"></td> <td th:text="${permission.permissionName }"></td> <td th:text="${permission.permissionDesc }"></td> <td class="text-center"> <a th:href="@{/backstage/permission/edit(pid=${permission.pid})}" class="btn bg-olive btn-xs">修改</a> <a th:onclick="|javascript:del(${permission.pid})|" class="btn bg-gray btn-xs">删除</a> </td> </tr> </tbody> </table> <!--数据列表/--> </div> <!-- 数据表格 /--> </div> <!-- .box-footer--> <div class="box-footer"> <div class="pull-left"> <div class="form-group form-inline"> 总共<span th:text="${permissionPage.pages}"></span>页，共<span th:text="${permissionPage.total}"></span>条数据。 </div> </div> <div class="box-tools pull-right"> <ul class="pagination"></ul> </div> </div> <!-- /.box-footer--> </div> </section> <!-- 正文区域 /--> </div> <!-- 底部导航 --> <footer th:replace="~{/backstage/common_footer::footer}"></footer></div>
<!-- 在js中获取Model的值 --><script th:inline="javascript"> function del(pid) { if (confirm("确定要删除吗?")) { location.href = "/backstage/permission/delete?pid=" + pid; } }
$(function () { var currentPage = [[${permissionPage.current}]]; // 当前页 var pages = [[${permissionPage.pages}]]; // 总页数 var contextPath = [[${#servletContext.contextPath}]]; // 项目绝对路径
// 分页插件 $('.pagination').bootstrapPaginator({ bootstrapMajorVersion: 3, // bootstrap版本 currentPage: currentPage, // 当前页 totalPages: pages, // 总页数 numberOfPages: 5, // 最多显示多少页 itemTexts: function (type, page, current) { switch (type) { case "first": return "首页"; case "prev": return "上一页"; case "next": return "下一页"; case "last": return "末页"; case "page": return page; } }, onPageClicked: function (event, originalEvent, type, page) { // 点击页码执行的方法 location.href = contextPath + "/backstage/permission/all?page=" + page; } }); })
</script></body></html>同学们可以根据自己的需求进行鉴权配置