快捷導(dǎo)航

springsecurity自定義登錄頁面的實現(xiàn)示例

更新時間：2025年09月23日 09:40:38 作者：shuair

本文主要介紹了springsecurity自定義登錄頁面的實現(xiàn)示例,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧

spring security框架使用

環(huán)境

jdk版本：jdk 17

依賴

<!-- spring boot 版本 3.2.0 -->

<!-- 
<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-dependencies</artifactId>
    <version>3.2.0</version>
    <type>pom</type>
    <scope>import</scope>
</dependency>
-->

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-web</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-thymeleaf</artifactId>
</dependency>

登錄認(rèn)證

依賴spring-boot-starter-security后，服務(wù)啟動時，控制臺日志會輸出自動生成的密碼

日志信息如下

Using generated security password: 2d9c8697-8ebd-4be7-afea-a6bc922a7d5b

This generated password is for development use only. Your security configuration must be updated before running your application in production.

默認(rèn)的用戶名為：user

依賴spring-boot-starter-security后，調(diào)用接口時就會進(jìn)行登錄認(rèn)證，會跳轉(zhuǎn)到默認(rèn)的登錄頁面：/login，該頁面是框架自帶的
1. 頁面加載較慢，樣式加載不成功，但不影響功能使用。原因：會加載一些無法訪問的css數(shù)據(jù)
2. 輸入默認(rèn)的用戶名和密碼，進(jìn)行登錄認(rèn)證，登錄認(rèn)證成功即可訪問接口數(shù)據(jù)
3. 該頁面可自定義
默認(rèn)的登出頁面：/logout，該頁面是框架自帶的
1. 頁面加載較慢，樣式加載不成功
2. 該頁面有一個確認(rèn)登出按鈕，點擊后即可退出登錄，調(diào)用接口時會重新進(jìn)行登錄認(rèn)證
3. 該頁面可自定義

spring security自定義登錄頁面

使用瀏覽器自帶的登錄頁面

添加一個配置類WebSecurityConfig.java，后續(xù)內(nèi)容也會在此類中進(jìn)行配置

package xin.yangshuai.springsecurity03.config;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.security.config.Customizer;
import org.springframework.security.config.annotation.web.builders.HttpSecurity;
import org.springframework.security.config.annotation.web.configurers.ExpressionUrlAuthorizationConfigurer;
import org.springframework.security.config.annotation.web.configurers.FormLoginConfigurer;
import org.springframework.security.web.SecurityFilterChain;

@Configuration
// @EnableWebSecurity
public class WebSecurityConfig {

    @Bean
    public SecurityFilterChain filterChain(HttpSecurity http) throws Exception {

        // 開啟授權(quán)保護(hù)
        http.authorizeRequests(new Customizer<ExpressionUrlAuthorizationConfigurer<HttpSecurity>.ExpressionInterceptUrlRegistry>() {
            @Override
            public void customize(ExpressionUrlAuthorizationConfigurer<HttpSecurity>.ExpressionInterceptUrlRegistry expressionInterceptUrlRegistry) {

                expressionInterceptUrlRegistry
                        // 對所有請求開啟授權(quán)保護(hù)
                        .anyRequest()
                        // 已經(jīng)認(rèn)證的請求會被自動授權(quán)
                        .authenticated();
            }
        });

        // 使用基本授權(quán)方式（瀏覽器自帶的登錄頁面，無默認(rèn)登出頁）
        http.httpBasic(Customizer.withDefaults());

        return http.build();
    }
}

http.authorizeRequests授權(quán)配置
此方式由瀏覽器彈出默認(rèn)登錄頁面進(jìn)行登錄認(rèn)證
@EnableWebSecurity此處不用開啟，依賴時已經(jīng)自動開啟

自定義登錄頁面

調(diào)整配置類WebSecurityConfig.java

package xin.yangshuai.springsecurity03.config;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.security.config.Customizer;
import org.springframework.security.config.annotation.web.builders.HttpSecurity;
import org.springframework.security.config.annotation.web.configurers.ExpressionUrlAuthorizationConfigurer;
import org.springframework.security.config.annotation.web.configurers.FormLoginConfigurer;
import org.springframework.security.web.SecurityFilterChain;

@Configuration
// @EnableWebSecurity
public class WebSecurityConfig {

    @Bean
    public SecurityFilterChain filterChain(HttpSecurity http) throws Exception {

        // 開啟授權(quán)保護(hù)
        http.authorizeRequests(new Customizer<ExpressionUrlAuthorizationConfigurer<HttpSecurity>.ExpressionInterceptUrlRegistry>() {
            @Override
            public void customize(ExpressionUrlAuthorizationConfigurer<HttpSecurity>.ExpressionInterceptUrlRegistry expressionInterceptUrlRegistry) {

                expressionInterceptUrlRegistry
                        // 對所有請求開啟授權(quán)保護(hù)
                        .anyRequest()
                        // 已經(jīng)認(rèn)證的請求會被自動授權(quán)
                        .authenticated();
            }
        });

        // 自定義登錄頁面
        http.formLogin(new Customizer<FormLoginConfigurer<HttpSecurity>>() {
            @Override
            public void customize(FormLoginConfigurer<HttpSecurity> httpSecurityFormLoginConfigurer) {
                // 自定義登錄頁，并且設(shè)置無需授權(quán)允許訪問
                httpSecurityFormLoginConfigurer.loginPage("/login").permitAll();
                // 配置自定義表單的用戶名參數(shù)，默認(rèn)值：username
                httpSecurityFormLoginConfigurer.usernameParameter("myusername");
                // 配置自定義表單的密碼參數(shù)，默認(rèn)值：password
                httpSecurityFormLoginConfigurer.passwordParameter("mypassword");
                // 校驗失敗時跳轉(zhuǎn)的地址，默認(rèn)值：/login?error
                httpSecurityFormLoginConfigurer.failureUrl("/login?error");
            }
        });

        return http.build();
    }
}

loginPage("/login")表示未授權(quán)時，會跳轉(zhuǎn)到GET /login接口，因此需要對GET /login接口響應(yīng)自定義的登錄頁面
usernameParameter("myusername")表示可以自定義提交表單參數(shù)，在登錄頁面，請求登錄認(rèn)證接口默認(rèn)是POST /login，用戶名、密碼的參數(shù)名可以自定義
failureUrl("/login?error")表示認(rèn)證失敗，會跳轉(zhuǎn)到GET /login?error接口，可以攜帶參數(shù)用來信息展示，實際上也是跳轉(zhuǎn)到了登錄頁面，只是攜帶了參數(shù)

配置登錄頁面接口

package xin.yangshuai.springsecurity03.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class LoginController {

    @GetMapping("login")
    public String login(){
        return "login";
    }
}

配置登錄頁面

根據(jù)thymeleaf模板引擎，頁面位置：src/main/resources/templates/login.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>登錄</title>
</head>
<body>
<h1>登錄</h1>
<div th:if="${param.error}">用戶名或密碼錯誤</div>

<!--
使用動態(tài)參數(shù)，th:action="@{/login}"
開啟防止csrf攻擊時，會自動生成_csrf隱藏字段
 -->

<form th:action="@{/login}" method="post">
    <div>
        <input type="text" name="myusername" placeholder="用戶名">
    </div>
    <div>
        <input type="password" name="mypassword" placeholder="密碼">
    </div>
    <input type="submit" value="登錄">
</form>
</body>
</html>