在《(一)spring security 之项目创建》中我们使用的是默认配置,spring security 为我们提供了个登陆界面和user用户,并在控制台打印出了登陆密码,登陆密码每次启动项目后是不同的,这显然不符合我们正式项目中的要求,下面我们通过继承WebSecurityConfigurerAdapter来实现界面的自定义,系统用户使用我们指定的表中获取
1.自定义登陆界面
1.1 引入依赖
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
1.2配置thymeleaf
在application-dev.yaml配置文件的spring:下增加如下内容
thymeleaf:
prefix: classpath:/templates/
suffix: .html
cache: false
mvc:
throw-exception-if-no-handler-found: true
# 静态文件请求匹配方式
static-path-pattern: /**
web:
resources:
static-locations: classpath:/templates/,classpath:/META-INF/resources/,classpath:/static/
1.3新增登陆endpoint
@Controller
public class IndexController {
@RequestMapping(value = "/login")
public String login(Model model) {
model.addAttribute("loginProcessUrl", "/login/authorize");
return "indexAction/login";
}
}
1.4在resources下新建文件夹templates/indexAction并在文件夹下新增登陆界面,并在resources下新建static文件夹放入css和js文件
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>统一身份管理平台</title>
</head>
<style>
.login-container {
margin: 50px;
width: 100%;
}
.form-container {
margin: 0px auto;
width: 50%;
text-align: center;
box-shadow: 1px 1px 10px #888888;
height: 300px;
padding: 5px;
}
input {
margin-top: 10px;
width: 350px;
height: 30px;
border-radius: 3px;
border: 1px #E9686B solid;
padding-left: 2px;
}
.btn {
width: 350px;
height: 35px;
line-height: 35px;
cursor: pointer;
margin-top: 20px;
border-radius: 3px;
background-color: #E9686B;
color: white;
border: none;
font-size: 15px;
}
.title {
margin-top: 5px;
font-size: 18px;
color: #E9686B;
}
</style>
<body>
<div class="login-container">
<div class="form-container">
<p class="title">用户登录</p>
<form name="loginForm" method="post" th:action="${loginProcessUrl}">
<input type="text" name="username" placeholder="用户名"/>
<br>
<input type="password" name="password" placeholder="密码"/>
<br>
<button type="submit" class="btn">登 录</button>
<a href="https://graph.qq.com/oauth2.0/authorize?response_type=code&client_id=101861287&redirect_uri=http://iotmaxcloud.com/oauth/login&state=test"
class="btn btn-primary btn-block">QQ登录</a>
</form>
</div>
</div>
</body>
</html>
1.5新增Security配置
@Configuration
@EnableWebSecurity
public class SecurityConfig extends WebSecurityConfigurerAdapter {
@Override
protected void configure(HttpSecurity http) throws Exception {
http.authorizeRequests()
.antMatchers("/login","/login/authorize")
.permitAll()
.anyRequest()
.authenticated()
.and()
.formLogin()
.loginPage("/login")
.loginProcessingUrl("/login/authorize");
}
}
说明:
1. antMatchers("/login").permitAll() 表示请求路径/login和/login/authorize不需要授权
antMatchers支持通配符*,其中/*表示任意个字符/**表示目录
2. formLogin() .loginPage("/login") 表示指定登陆界面地址为/login
3. loginProcessingUrl("/login/authorize") 表示登陆界面提交登陆请求的路径为/login/authorize