Spring boot:3.X + Security OAuth2 自定义登录页面、登出后跳转到登录页

本文描述了基于 Spring Oauth2 的 code 模式,实现登陆同时授权、自定义登录界面、登出页面的功能。

1.Maven依赖:

<parent>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-parent</artifactId>
    <version>3.1.6</version>
    <relativePath/>
</parent>
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-oauth2-authorization-server</artifactId>
</dependency>
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-security</artifactId>
</dependency>
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-web</artifactId>
</dependency>

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-configuration-processor</artifactId>
    <optional>true</optional>
</dependency>
<!-- thymeleaf 模板引擎-->
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

 2.thymeleaf配置

在spring boot工程的application.yml配置文件中

 

spring:
  thymeleaf:
    prefix: classpath:/singleSign/
    suffix: .html
    cache: false

3.登陆界面HTML

登录页面需要符合thymeleaf格式,不符合格式的不支持,在resources 目录下新建singleSign目录,在此目录下新建login.html(文件名不能乱命名,要跟下面的Controller、WebSecurity 相对应) 文件如下:

<!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="${login}">
			<input type="text" name="username" placeholder="用户名"/>
			<br>
			<input type="password" name="password" placeholder="密码"/>
			<br>
			<button type="submit" class="btn">登 &nbsp;&nbsp; 录</button>
		</form>
		<p style="color: red" th:if="${param.error}">用户名或密码错误</p>
	</div>
</div>
</body>
</html>

4.登陆界面Controller

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.security.oauth2.provider.AuthorizationRequest;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
 
@Controller
public class BaseMainController {  

    @GetMapping("/login") // 设置登录页面的路由
    public String loginPage() {
        return "login"; // 返回视图名称,这里假设有一个名为"login"的模板文件(与login.html相对应)
    }
}

5.WebSecurity 配置


配置自定义登录、登出需要的参数

@Bean
    @Order(2)
    public SecurityFilterChain defaultSecurityFilterChain(HttpSecurity http)
            throws Exception {
        http
                .authorizeHttpRequests((authorize) -> authorize
                        .requestMatchers("/oauth/**","/login/**","/logout/**")
                        .permitAll()
                        .anyRequest().authenticated()
                )
                //自定义登录页
                .formLogin(formLogin->
                        formLogin.loginPage("/login") //登录页面
                                .loginProcessingUrl("/login").permitAll() //登录接口可以匿名访问
                                .defaultSuccessUrl("/our/page"))//登录成功访问的页面
                .csrf().disable()
                //自定义登出页
                .logout(logout->
                                logout.
                                        logoutUrl("/logout")
                                        .addLogoutHandler(new MyLogoutHandler())//登出后的跳转页
                                        .logoutSuccessUrl("/login")
                                        .permitAll()
                );
        return http.build();
    }

配置登出跳转LogoutHandler ,为防止要跳转的页面网址有问题,需要对网址进行base64Encode后,以参数(名称:redirect_uris)的形式传进来


import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;
import org.authorization.util.EncryptUtils;
import org.springframework.security.core.Authentication;
import org.springframework.security.web.authentication.logout.LogoutHandler;
import org.springframework.stereotype.Component;

import java.io.IOException;

@Component
public class MyLogoutHandler implements LogoutHandler {

    @Override
    public void logout(HttpServletRequest request, HttpServletResponse response, Authentication authentication) {
        try {
            String url = request.getParameter("redirect_uris");
            response.sendRedirect(EncryptUtils.base64Decode(url));//实现自定义重定向
        } catch (IOException e) {
            e.printStackTrace();
        }
    }
}

6.自定义登录效果

访问登录URL:

http://127.0.0.1:80/auth/oauth2/authorize?client_id=XXXX&response_type=code&scope=openid&redirect_uri=https://www.baidu.com

7.自定义登出效果

对第6步中的登录URL进行base64Encode加密后,作为redirect_uris参数传入,访问:

http://127.0.0.1:80/auth/logout?redirect_uris=aHR0cDov....

后,系统会自动跳转到 第6步中的登录页。

  • 14
    点赞
  • 19
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
要关闭Spring Security OAuth2的默认登录表单并自定义登录页面,您需要执行以下操作: 1. 创建一个自定义登录页面,例如/login。 2. 在Spring Security配置中禁用默认登录表单,如下所示: ``` @Override protected void configure(HttpSecurity http) throws Exception { http .authorizeRequests() .antMatchers("/login").permitAll() .anyRequest().authenticated() .and() .formLogin() .loginPage("/login") .permitAll() .and() .logout() .permitAll(); } ``` 在上面的代码中,`.antMatchers("/login").permitAll()`表示允许所有用户访问/login面,并且`.formLogin().loginPage("/login").permitAll()`指定了自定义登录页面的URL。 3. 创建一个自定义登录表单,该表单将POST请求发送到Spring Security的/oauth/token端点,以便验证用户凭据。以下是示例HTML代码: ``` <form method="post" action="/oauth/token"> <div> <label for="username">Username:</label> <input type="text" id="username" name="username"/> </div> <div> <label for="password">Password:</label> <input type="password" id="password" name="password"/> </div> <div> <input type="submit" value="Login"/> </div> <input type="hidden" name="grant_type" value="password"/> <input type="hidden" name="scope" value="read write"/> <input type="hidden" name="client_id" value="my-client"/> <input type="hidden" name="client_secret" value="my-secret"/> </form> ``` 在上面的代码中,`<input type="hidden" name="grant_type" value="password"/>`表示使用密码授权类型进行身份验证,`<input type="hidden" name="scope" value="read write"/>`指定访问令牌的作用域,`<input type="hidden" name="client_id" value="my-client"/>`和`<input type="hidden" name="client_secret" value="my-secret"/>`指定客户端ID和密钥。 4. 使用您选择的Web框架创建/login端点,并在该端点上呈现自定义登录表单。当用户提交表单时,将使用Spring Security OAuth2的/oauth/token端点验证用户凭据并返回访问令牌。 请注意,此方案仅适用于密码授权类型。如果您需要其他授权类型(例如授权代码或隐式授权),则需要实现相应的授权流程。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值