[에러] Spring Security 부트스트랩Bootstrap 404에러, CSS 적용 에러

에러 배경

스프링 시큐리티를 사용하여 로그인 페이지를 구현하고자 하였다.
그중 웹 부분은 부트스트랩과 타임리프를 적용하는 과정에서 CSS가 적용이 되지 않았고 404에러가 떴다

에러 내용

• 로그인 페이지 CSS 적용 에러
  

• 로그인 성공 후 404 에러
  원래 바로 /hom url로 이동해야하는게 정상이었다

• 시큐리티가 적용되지 않은 페이지는 정상적으로 CSS와 페이지 이동이 가능했다
  

위의 결과를 통해 시큐리티가 적용된 페이지는 CSS가 적용되지 않았고 더불어 페이지 이동도 되지 않는다는 것을 알 수 있다.

시중의 모든 검색을 통해 적용해본 나의 config파일...

@Configuration
@EnableWebSecurity
public class WebSecurityConfig extends WebSecurityConfigurerAdapter {

  //  css적용
    @Override
    public void configure(WebSecurity web) throws Exception {
        web
                .ignoring()
                .antMatchers("/resources/**");

        web.ignoring() .requestMatchers(PathRequest.toStaticResources().atCommonLocations());

    }


    @Override
    protected void configure(HttpSecurity http) throws Exception {

        http
                .authorizeRequests()
                .mvcMatchers("/","/css/**","/scripts/**","/plugin/**","/fonts/**")
                .permitAll();

        http
                .authorizeRequests() //url 기반의 권한 확인
                .antMatchers("/home/**", "/css/**")
                .anonymous()
                .anyRequest()
                .authenticated()
              .and()
                .formLogin()
                .loginPage("/user/login") //만든 페이지 이동
                .defaultSuccessUrl("/home")
                .permitAll()
                ;

    }

}

에러 해결

시중의 블로그와 검색에서 사용된 내용과 다른점이 있다면 나는 부트스트랩을 Gradle에 적용하여 CSS페이지를 별도로 만들지 않고 사용했었다.
따라서 위의 설정 파일들이 제대로 적용되지 않았을수도 있다는 것.

static 폴더에 CSS 파일을 넣고, Gradle설정을 다시 준뒤, Config파일에 아래의 코드를 넣어 해결되었다.

   http
                .authorizeRequests()
                .mvcMatchers(
                        "/",
                        "/css/**",
                        "/scripts/**",
                        "/plugin/**",
                        "/fonts/**",
                        "/docs/**",
                        "/webjars/**",
                        "/cover.css",
                        "/signin.css"
                )
                .permitAll();

antMatchers, mvcMatchers 차이는 뭘까?

특정경로 지정해서 권한을 설정할때 antMatchers, mvcMatchers를 사용한다. 내가 위에서 CSS경로를 설정한 것은 antMatchers였다. antMatchers는 URL 매핑 할때 개미패턴, mvcMatchers는 mvc패턴이다. antMatchers(”/info”) 하면 /info URL과 매핑 되지만 mvcMatchers(”/info”)는 /info/, /info.html 이 매핑이 가능하다.

참고자료
https://stackoverflow.com/questions/50536292/difference-between-antmatcher-and-mvcmatcher
https://deftkang.tistory.com/217