基于该篇文章修改。
目前官方文档并不完善，便做此记录。
置方式来源于官方仓库issues

oauth2-server模块pom添加thymeleaf依赖

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>

登录页面

修改DefaultSecurityConfig

    @Bean
    SecurityFilterChain defaultSecurityFilterChain(HttpSecurity http) throws Exception {
        http.formLogin(form ->
                        form.loginPage("/login")
                                .loginProcessingUrl("/login")
                )
                .authorizeRequests(requests ->
                        requests.antMatchers("/login").permitAll()
                                .anyRequest().authenticated()
                );

        return http.build();
    }

模板页面

<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>登录页面</title>
</head>
<body>
<h3>登录</h3>
<form th:action="@{/login}" method="post">
    <table>
        <tr>
            <td>用户名：</td>
            <td><input type="text" name="username"></td>
        </tr>
        <tr>
            <td>密码：</td>
            <td><input type="password" name="password"></td>
        </tr>
        <tr>
            <td colspan="2">
                <button type="submit">登录</button>
            </td>
        </tr>
    </table>
</form>
</body>
</html>

添加控制器

@Slf4j
@Controller
public class Oauth2Controller {
    @GetMapping("login")
    public String login() {
        return "login";
    }
}

效果

在这里插入图片描述

授权页面

修改AuthorizationServerConfiguration

void defaultOAuth2AuthorizationServerConfigurer(HttpSecurity http) throws Exception {
        OAuth2AuthorizationServerConfigurer<HttpSecurity> authorizationServerConfigurer = new OAuth2AuthorizationServerConfigurer<>();
        RequestMatcher authorizationServerEndpointsMatcher = authorizationServerConfigurer.getEndpointsMatcher();

		//添加自定义授权页面
        authorizationServerConfigurer.authorizationEndpoint(endpoint -> {
            endpoint.consentPage("/oauth2/consent");
        });
        
        // 拦截 授权服务器相关的请求端点
        http.requestMatcher(authorizationServerEndpointsMatcher)
                .authorizeRequests().anyRequest().authenticated().and()
                // 忽略掉相关端点的csrf
                .csrf(csrf -> csrf.ignoringRequestMatchers(authorizationServerEndpointsMatcher))
                // 应用 授权服务器的配置
                .apply(authorizationServerConfigurer);
    }

添加控制器

@Slf4j
@Controller
public class Oauth2Controller {
    @GetMapping("login")
    public String login() {
        return "login";
    }

    @RequestMapping("/oauth2/consent")
    public String consent(@RequestParam String scope, @RequestParam String client_id, @RequestParam String state, Authentication authentication, Model model) {
        log.info("/oauth2/consent------>scope:{} client_id:{} state:{} authentication:{}",scope,client_id,state,authentication);

        model.addAttribute("scopes", scope.split(" "));
        model.addAttribute("clientId", client_id);
        model.addAttribute("state", state);
        return "consent";
    }
}

模板页面

<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<form method="post" th:action="@{/oauth2/authorize}">
    <input type="hidden" name="client_id" th:value="${clientId}"/>
    <input type="hidden" name="state" th:value="${state}"/>
    <div th:each="scope : ${scopes}">
        <input type="checkbox" name="scope" th:value="${scope}" th:id="${scope}" th:text="${scope}"/><br/>
    </div>

    <button type="submit">同意</button>
</form>
</body>
</html>