백엔드(스프링) 와 프론트(리액트) 서버를 연결하는 중 SpringSecurity 관련한 문제가 발생하였습니다.

(저희가 밤잠을 줄여가며 여러가지 시도를 해봤지만 실패했었습니다...ㅠ )

1. SpringSecurity JWT

저희는 Github Oauth2 를 통해서 로그인을 진행하고 있으며 Oauth2가 정상적으로 로그인 된 경우에 accessToken을 발급하고 있습니다. 그리고 그 다음의 서비스 로직들을 타려면 이 accessToken을 Header의 Authorization에 넣어주어야 합니다. (grantType = Bearer입니다)

2. 현상

1. Post Method를 이용 시에 403에러가 발생합니다.
2. Get Method의 경우 정상적으로 작동합니다.
3. PostMan에서 테스트를 했을 때는 정상 동작합니다

프론트에서 넘겨주는 Authorization Header는 이렇습니다 . Authorization = "Bearer ${accessToken}"

FE팀에서 토큰값을 제대로 보내고, 서버의 OncePerRequestFilter 가 토큰 값을 제대로 가져오고, 토큰에서 userId 를 파싱해서 Member 를 DB에서 조회해 Authentication 객체를 리턴하는 것도 확인했습니다.

3. 조치

1. 저희는 처음에 이 현상이 CORS , CSRF 와 관련이 있다고 생각하여서 WebMvcConfigurer 에서 프론트에서 접근하는 urlhttp://localhost:5173/을%EC%9D%84) allowedOrigins로 설정해두었습니다. 하기는 설정해 둔 코드입니다.

public void addCorsMappings(CorsRegistry registry) {
        WebMvcConfigurer.super.addCorsMappings(registry);

        registry.addMapping("/**")
                .allowedHeaders("*")
                .allowedOrigins("<https://stately-yeot-007fa8.netlify.app>")
                .allowedOrigins("<https://mlf.vercel.app>")
                .allowedOrigins("<http://localhost:8080>")
                .allowedOrigins("<http://localhost:3000>")
                .allowedOrigins("<http://localhost:5173>")
                .allowedMethods("GET", "POST", "DELETE", "PUT", "HEAD", "OPTIONS")
                .exposedHeaders("Authorization")
                .allowCredentials(true);
    }
}

2. 1의 조치를 했음에도 프론트에서 여전히 똑같은 문제가 발생하여서,

HttpSecurity 설정을 하기와 같이 변경하여습니다.

http
         
                .cors().disable()
                httpBasic().disable()
                .csrf().disable()
                .headers().frameOptions().disable();