SpringBoot|【SpringBoot】(四)SpringBoot + SpringSecurity + Thymeleaf 整合

在 SpringBoot 工程中,借用 SpringSecurity 权限框架来对登录用户所拥有的不同的权限来显示不同的页面。并且,如果有用户已登录,则右上角显示用户名和其角色。如下图:
admin 用户权限最大,显示所有页面内容:
SpringBoot|【SpringBoot】(四)SpringBoot + SpringSecurity + Thymeleaf 整合
文章图片

zzc 用户只有两个角色权限,所以,只显示部分内容:
SpringBoot|【SpringBoot】(四)SpringBoot + SpringSecurity + Thymeleaf 整合
文章图片

没有用户登录时,页面显示如下:
SpringBoot|【SpringBoot】(四)SpringBoot + SpringSecurity + Thymeleaf 整合
文章图片

【首页】、【登录】下方的内容都没有显示。
好了,需求已经了解清楚了,那咱们就直接上代码了哈。【文末有源码】
【开发环境】:

  • IDEA-2020.2
  • SpringBoot-2.5.5
  • MAVEN-3.5.3
  • SpringSecurity
  • Thymeleaf
项目结构图
后台:
SpringBoot|【SpringBoot】(四)SpringBoot + SpringSecurity + Thymeleaf 整合
文章图片

前台:
【SpringBoot|【SpringBoot】(四)SpringBoot + SpringSecurity + Thymeleaf 整合】SpringBoot|【SpringBoot】(四)SpringBoot + SpringSecurity + Thymeleaf 整合
文章图片

1、引入依赖:
org.springframework.boot spring-boot-starter-web org.springframework.boot spring-boot-starter-security org.springframework.boot spring-boot-starter-thymeleaf org.thymeleaf.extras thymeleaf-extras-springsecurity5

2、添加 application.yml 配置:
spring: thymeleaf: cache: false prefix: classpath:/templates/# 配置模板(非必要) 默认是 templates suffix: .html

3、后台路由控制器 RoutingController
@Controller public class RoutingController {@GetMapping({"/", "/index"}) public String index() { return "index"; }@GetMapping("/toLogin") public String toLogin() { return "views/login"; }@GetMapping("/level1/{id}") public String level1(@PathVariable("id") int id) { return "views/level1/" + id; }@GetMapping("/level2/{id}") public String level2(@PathVariable("id") int id) { return "views/level2/" + id; }@GetMapping("/level3/{id}") public String level3(@PathVariable("id") int id) { return "views/level3/" + id; }}

4、SpringSecurity 配置类 SecurityConfig
使用 SpringSecurity 需要添加一个配置类:
@EnableWebSecurity public class SecurityConfig extends WebSecurityConfigurerAdapter {// 授权 @Override protected void configure(HttpSecurity http) throws Exception { // 1.配置请求授权规则 // 首页所有人可以访问;其它页面需要相应的角色权限才能访问 http.authorizeRequests() .antMatchers("/").permitAll() .antMatchers("/level1/**").hasRole("vip1") .antMatchers("/level2/**").hasRole("vip2") .antMatchers("/level3/**").hasRole("vip3"); // 2.没有权限,默认会跳转到登录页面,需要开启登录页面 http.formLogin() // 自定义登录页面 .loginPage("/toLogin").usernameParameter("name").passwordParameter("pwd").loginProcessingUrl("/login"); // 关闭csrf http.csrf().disable(); // 3.注销,跳转到首页 http.logout().logoutSuccessUrl("/"); }// 认证 @Override protected void configure(AuthenticationManagerBuilder auth) throws Exception { // inMemoryAuthentication:从内存中认证; jdbcAuthentication:从数据库中认证 // BCryptPasswordEncoder:密码编码规则,如果没有设置,则登录时会报错 auth.inMemoryAuthentication().passwordEncoder(new BCryptPasswordEncoder()) .withUser("zzc").password(new BCryptPasswordEncoder().encode("66666")).roles("vip1", "vip3") .and() .withUser("admin").password(new BCryptPasswordEncoder().encode("admin")).roles("vip1", "vip2", "vip3"); }}

  • configure(HttpSecurity http):配置了访问哪些 url,需要相对应的角色
  • configure(AuthenticationManagerBuilder auth):配置了哪些用户有哪些角色
5、前台首页 index.html
首页 - 锐客网

这段代码:

当用户登录后,就显示用户名和角色
这段代码:

只有角色是 vip1 的时候,才显示其内容
6、登录页面 login.html
Title - 锐客网 登录页面
用户名:
密码:

【注意】:这里的登录后台接口是 /login,但是,在我们自己的后台接口中是没有这个接口的,它是通过 SpringSecurity 进行处理的。
所以,我们 SecurityConfig#configure(HttpSecurity http) 方法中有如下代码:
http.formLogin() // 自定义登录页面 .loginPage("/toLogin").usernameParameter("name").passwordParameter("pwd").loginProcessingUrl("/login");

7、页面内容 1.html
level1/level2/level3 文件夹下的 html 文件内容基本一致,如下:
Title - 锐客网 level1-1

这里就不重复粘贴了哈。
源代码已上传至码云

    推荐阅读