如果我打开身份验证，外部 CSS 文件不起作用

Question

如果我使用 Spring 安全性打开身份验证，则外部 CSS 文件不起作用。

@EnableWebSecurity
@Configuration
class SecurityConfig {

    @Bean
    fun security(http:HttpSecurity):SecurityFilterChain{
        http
            .formLogin()
                .loginPage("/")
                .failureUrl("/")
                .and()
            .logout()
                .logoutSuccessUrl("/")
                .and()
            .authorizeHttpRequests()
                .requestMatchers("/","/about_us").permitAll()
                .anyRequest().authenticated()
        return http.build();
    }
}

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>BigBroHelp</title>
  <link rel="stylesheet" type="text/css" href="../../static/css/final_form.css">
  <link th:href="@{/css/start_page/final_form.css}" rel="stylesheet">
  <link th:href="@{https://fonts.googleapis.com/css2?family=Jost:wght@500&display=swap}" rel="stylesheet">
  <link th:href="@{/img/ответы_нейро_бошка.png}" rel="icon" type="image/png" style="width: 1000px">
  <script th:src="@{/js/start_page/validation_counter.js}"></script>
  
</head>
<body id="body">


<div class="main">
  <input type="checkbox" id="chk" aria-hidden="true">

  <div class="signup">
    <form>
      <label for="chk" aria-hidden="true" id="reg_label">Регистрация</label>
      <p id="count">0</p>
      <input type="text" name="txt" placeholder="Логин" required="" id="reg_input_login" onclick="count()">
<!--      <input type="email" name="email" placeholder="Почта" required="">-->
      <input type="password" name="pswd" placeholder="Пароль" required="">
      <button onclick="count()">Зарегистрироваться</button>
    </form>
  </div>

  <div class="login">
    <form>
      <label for="chk" aria-hidden="true">Войти</label>
      <input type="email" name="email" placeholder="Логин" required="">
      <input type="password" name="pswd" placeholder="Пароль" required="">
      <button>Войти</button>
    </form>
  </div>
</div>

<div class="bigBro">
  <div class="modal">
    <h1>
      Big Bro Help<br>
    </h1>

    <a class="btn" id="about_us" th:href="@{/about_us}">О проекте </a><br>

  </div>
</div>

</body>
</html>

@EnableWebSecurity
@Configuration
class SecurityConfig {

    @Bean
    fun security(http:HttpSecurity):SecurityFilterChain{
        http
            .authorizeHttpRequests()
                .anyRequest().permitAll()
        return http.build();
    }
}

如果我留下任何请求 permitAll 外部 CSS 文件有效。 但是，如果我打开身份验证，css 文件将不起作用。

• Spring 引导版本 3.0.2 (Spring Security 6.0.1)
• Thymeleaf 版本 3.1.1

Answer 1

确保 Spring 安全不需要像这样对您的 CSS 进行身份验证：

@Bean
    fun security(http:HttpSecurity):SecurityFilterChain{
        http
            .formLogin()
                .loginPage("/")
                .failureUrl("/")
                .and()
            .logout()
                .logoutSuccessUrl("/")
                .and()
            .authorizeHttpRequests()
                .requestMatchers("/","/about_us").permitAll()
                .requestMatchers(PathRequest.toStaticResources().atCommonLocations()).permitAll()
                .anyRequest().authenticated()
        return http.build();
    }

请注意添加的这一行：

.requestMatchers(PathRequest.toStaticResources().atCommonLocations()).permitAll()