基于springboot+bootstrap+mysql+redis怎么搭建完整的权限架构

魁首哥

作者

基于springboot+bootstrap+mysql+redis怎么搭建完整的权限架构

这篇文章主要介绍了基于springboot+bootstrap+mysql+redis怎么搭建完整的权限架构的相关知识，内容详细易懂，操作简单快捷，具有一定借鉴价值，相信大家阅读完这篇基于springboot+bootstrap+mysql+redis怎么搭建完整的权限架构文章都会有所收获，下面我们一起来看看吧。

首先将已经封装好的bootstrap脚本引入到我们现有的工程，目录如下：

到此我们的bootstraop框架引入完成，那么基于bootstrap框架我们现在开始开发属于我们的第一个bootstrap页面登陆页，打开我们的templates文件在底下找到我们login.html页面，进行重新的编辑该页面代码如下：

<!DOCTYPEhtml><htmlxmlns:th="http://www.thymeleaf.org"><head><metacontent="text/html;charset=UTF-8"/><metaname="viewport"content="width=device-width,initial-scale=1.0"/><title>登录页面</title><linkrel="stylesheet"th:href="@{/css/bootstrap.min.css}"/><styletype="text/css">body{padding-top:50px;}.starter-template{padding:40px15px;text-align:center;}</style></head><body><divclass="container"><divclass="starter-template"><pth:if="${param.logout}"class="bg-warning">已成功注销</p><pth:if="${param.error}"th:text="${session.SPRING_SECURITY_LAST_EXCEPTION.message}=='Badcredentials'?'账号/密码错误！':${session.SPRING_SECURITY_LAST_EXCEPTION.message}"class="bg-danger"></p><h2>使用账号密码登录</h2><formname="form"th:action="@{/login}"action="/login"method="POST"><divclass="form-group"><labelfor="username">账号</label><inputtype="text"class="form-control"name="username"id="username"value=""placeholder="账号"/></div><divclass="form-group"><labelfor="password">密码</label><inputtype="password"class="form-control"name="password"id="password"placeholder="密码"/></div><inputtype="submit"id="login"value="Login"class="btnbtn-primary"/></form></div></div></body></html>

重新加载并运行我们的程序我们会看到我们全新的页面效果如下所示：

到此我们的登陆的首页已经完成了，接着我们再开发我们登陆成功以后的主页main.html，在我们编写我们的主页的时候，我们需要重新设计下我们的数据库，因此我们现有的表结构无法支撑起来我们的整个业务系统，因此我们重新设计了我们的数据库如下图：

接着我们直接生成我们的数据库执行脚本，并在我们的数据库中执行，同时使用我们上一章开发的工具我们来快速生成我们的代码,并根据我们的权限架构来修改我们的代码，以下是经过修改以后的代码的结构：

在我们的工程中有一些我们经常用到的CSS或者js 我们并不想每个页面都进行一次引用，因此我们新建一个全局的引用到我们的工程（在templates底下新建一个文件夹include同时创建includebase.html文件）中如下：

<htmlxmlns:th="http://www.thymeleaf.org"><linkth:href="@{/css/bootstrap.min.css}"rel="stylesheet"/><linkth:href="@{/css/bootstrap-table.css}"rel="stylesheet"/><linkth:href="@{/font-awesome/css/font-awesome.min.css}"rel="stylesheet"/><linkth:href="@{/css/bootstrap-datetimepicker.css}"rel="stylesheet"/><linkth:href="@{/css/bootstrapValidator.min.css}"rel="stylesheet"/><linkth:href="@{/css/fileinput.css}"rel="stylesheet"/><linkth:href="@{/css/fileinput-rtl.css}"rel="stylesheet"/><linkth:href="@{/css/theme.css}"rel="stylesheet"/><linkth:href="@{/css/zTreeStyle/metro.css}"rel="stylesheet"/><scriptth:src="@{/js/sockjs.min.js}"></script><scriptth:src="@{/js/stomp.min.js}"></script><scriptth:src="@{/js/jquery.js}"></script><scriptth:src="@{/js/distpicker/distpicker.data.js}"></script><scriptth:src="@{/js/distpicker/distpicker.js}"></script><scriptth:src="@{/js/websocket/socketUtil.js}"></script><scriptth:src="@{/js/bootstrap.min.js}"></script><scriptth:src="@{/js/bootstrap/nav/nav.js}"></script><scriptth:src="@{/js/bootstrap/tab/bootstrap-tab.js}"></script><scriptth:src="@{/js/bootstrap/tree/tree.js}"></script><scriptth:src="@{/js/bootstrap/alert/alert.js}"></script><scriptth:src="@{/js/bootstrap/table/bootstrap-table.js}"></script><scriptth:src="@{/js/bootstrap/date/bootstrap-datetimepicker.js}"></script><scriptth:src="@{/js/bootstrap/validator/bootstrapValidator.min.js}"></script><scriptth:src="@{/js/bootstrap/upload/fileinput.min.js}"></script><scriptth:src="@{/js/bootstrap/upload/plugins/sortable.js}"></script><scriptth:src="@{/js/bootstrap/upload/locales/zh.js}"></script><scriptth:src="@{/js/bootstrap/upload/theme.js}"></script><scriptth:src="@{/js/bootstrap/ztree/jquery.ztree.all-3.5.min.js}"></script><scriptth:src="@{/js/bootstrap/checkbox/checkbox.js}"></script><scriptth:src="@{/js/ajaxutil/ajaxUtil.js}"></script><scriptth:src="@{/js/dict/dictUtil.js}"></script><scriptth:src="@{/js/bootstrap/date/date.prototype.format.js}"></script><scriptth:src="@{/js/bootstrap/util/number.pick.util.js}"></script></html>

通过以上的代码的快速生成、修改以及配置我们这才可以正式开发我们的登陆成功以后的首页，首页代码如下：

<htmlxmlns:th="http://www.thymeleaf.org"xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4"><headth:include="include/includebase"></head><linkth:href="@{css/sb-admin.css}"rel="stylesheet"/><scriptth:inline="javascript">$(function(){//页面加载完成以后开启websocket的连接varoptions=newArray();options.sockurl='/ricky-websocket';options.stompClienturl='/ricky/topic/greetings';options.login=[[${#authentication.name}]];options.success=function(greeting){varr=eval("("+JSON.parse(greeting.body).content+")")alert(r);//$("#greetings").append("<tr><td>"+JSON.parse(greeting.body).content+"</td></tr>");}$.fn.socketConnect(options);//初始化nav$.fn.bootstrapNav({index:'main',navTitle:'XXXX管理系统'});//初始化标签页$("#tabContainer").tabs({data:[{id:'99999999',text:'首页',url:"home",closeable:false}],showIndex:0,loadAll:false})//$.fn.bootstrapTree({url:"/user/mainTree",treeId:'menu_tree',tabId:"tabContainer"});$.fn.dictUtil("/dict/loadDict");});</script><body><divid="wrapper"><navclass="navbarnavbar-inversenavbar-fixed-top"role="navigation"><divclass="navbar-header"id="navbar_header"></div><ulclass="navnavbar-righttop-nav"><liclass="dropdown"><ahref="#"class="dropdown-toggle"data-toggle="dropdown"><iclass="fafa-envelope"></i><bclass="caret"></b></a><ulclass="dropdown-menumessage-dropdown"><liclass="message-preview"><ahref="#"><divclass="media"><spanclass="pull-left"><imgclass="media-object"src="http://placehold.it/50x50"alt=""/></span><divclass="media-body"><h5class="media-heading"><strong>JohnSmith</strong></h5><pclass="smalltext-muted"><iclass="fafa-clock-o"></i>Yesterdayat4:32PM</p><p>Loremipsumdolorsitamet,consectetur...</p></div></div></a></li><liclass="message-preview"><ahref="#"><divclass="media"><spanclass="pull-left"><imgclass="media-object"src="http://placehold.it/50x50"alt=""/></span><divclass="media-body"><h5class="media-heading"><strong>JohnSmith</strong></h5><pclass="smalltext-muted"><iclass="fafa-clock-o"></i>Yesterdayat4:32PM</p><p>Loremipsumdolorsitamet,consectetur...</p></div></div></a></li><liclass="message-preview"><ahref="#"><divclass="media"><spanclass="pull-left"><imgclass="media-object"src="http://placehold.it/50x50"alt=""/></span><divclass="media-body"><h5class="media-heading"><strong>JohnSmith</strong></h5><pclass="smalltext-muted"><iclass="fafa-clock-o"></i>Yesterdayat4:32PM</p><p>Loremipsumdolorsitamet,consectetur...</p></div></div></a></li><liclass="message-footer"><ahref="#">ReadAllNewMessages</a></li></ul></li><liclass="dropdown"><ahref="#"class="dropdown-toggle"data-toggle="dropdown"><iclass="fafa-user"></i><fontth:text="${#authentication.name}"></font><bclass="caret"></b></a><ulclass="dropdown-menu"><li><ahref="#"><iclass="fafa-fwfa-gear"></i>修改密码</a></li><liclass="divider"></li><li><ahref="/logout"><iclass="fafa-fwfa-power-off"></i>退出</a></li></ul></li></ul><divclass="collapsenavbar-collapsenavbar-ex1-collapse"><ulclass="navnavbar-navside-nav"id="menu_tree"></ul></div></nav><divid="page-wrapper"style="border-radius:5px5px00;"><divid="tabContainer"></div></div></div></body></html>

关于“基于springboot+bootstrap+mysql+redis怎么搭建完整的权限架构”这篇文章的内容就介绍到这里，感谢各位的阅读！相信大家对“基于springboot+bootstrap+mysql+redis怎么搭建完整的权限架构”知识都有一定的了解，大家如果还想学习更多知识，欢迎关注恰卡编程网行业资讯频道。

阅读全文

发布于 2022-03-29 22:27:43