[SpringBoot] CORS 설정하기

울상냥·2023년 2월 10일
0

SpringBoot

목록 보기
3/11
post-custom-banner

로컬 프로젝트에서는 만나지 못했던 CORS오류를 배포를 하면서 만나게 되었다.

클라이언트에서 서버로 요청을 보내면 이러한 오류를 뱉어낸다.

Access to XMLHttpRequest at 'http://server' from origin 'http://client' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

역시나 쉽게 연결을 허락해주지 않는다.. 호락호락..호락호락하지 않다..


CORS가 무엇이냐 하면

Cross-Origin Resource Sharing 의 약자로 해석하자면 교차 출처 리소스 공유 정책 이다.

SOP정책에 의해서 두 출처(Origin)의 일치를 확인하게 되는데

출처(Origin)의 동일함은 두 URL의 구성 요소 중 Protocol(Scheme), Host, Port 의 3가지가 동일하다면 동일 출처로 판단한다.

고로 배포를 하게 되면서 두 출처가 일치하지 않게 되어 CORS오류를 뱉어내는 것이다. CORS에 대한 자세한 설명은 구글링 으로 ..

참고로 로컬 환경에서의 proxy 설정은 두 도메인이 일치하지 않게 되면서 사용할 수 없게 되었다.

이러한 CORS문제를 해결하기 위한 몇가지 방법이 있다.


CORS 설정하기

내가 시도했던 두가지만 간단하게 설명하자면

1. @CrossOrigin 어노테이션 사용하기

@CrossOrigin(origins = "http://client") 을 원하는 컨트롤러 혹은 메서드에 붙여주는 아주 간단한 방법이다.

@CrossOrigin(origins = "http://client")
@RestController
public class HelloController {
	... (중략)
}

첫 CORS오류와 불편한 만남 이후에 사용했지만 글로벌하게 설정하지 못한다는 단점이 있다.
전역적으로 설정을 해주기 위해 config 설정을 해주었다.
filter을 사용하는 방법보다 config가 간단해 보였기 때문에..

2. CorsConfig 생성하기

WebMvcConfigureraddCorsMappings를 오버라이딩 하여 작성한다.

@Configuration
public class CorsConfig implements WebMvcConfigurer {

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedMethods("*")
                .allowedOrigins("http://client");
    }
}
  • addMapping : 모든 경로를 설정해 줄 것이기 때문에 /**로 설정
  • allowedMethods : 모든 http method를 허용할 것으로 *로 설정

위와 같은 설정 이후 회원가입과 로그인 테스트에서 아무런 문제가 없었다.
문제는 로그인 이후에 CORS오류를 다시 만나게 되었다.. (그만..그만해주세요)
원인은 springsecurity쪽에 있었다.

SpringSecurity를 사용한다면

springsecurity를 사용하고 있다면 WebSecurityConfig에도 CORS설정을 해주어야 한다.

@RequiredArgsConstructor
@EnableWebSecurity
public class WebSecurityConfig {


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

        http.cors();
        
        ...(중략)

        return http.build();
    }

filterChainhttp.cors()를 추가해주면 CORS놈과 한발짝 멀어질 수 있다.
위와 같은 설정을 해주면 Bean에 등록된 corsfilter 또는 corsconfigure을 찾아서 사용한다고 한다.

profile
안되면 되게하라
post-custom-banner

0개의 댓글