스프링 시큐리티 - CORS란?

스프링 시큐리티는 사용자 요청에 관하여 그것이 정당한 요청인지를 검사한다.

여기서 정당한 요청은 사용자의 인증 및 인가는 물론이고, 그것이 올바른 요청을 통해 전달 되었는지를 포함한다.

 

CORS(Cross Origin Resource Sharing)?

전체 명칭은 위에 있듯이 교차 출처 리소스 공유이다.

CORS는 브라우저 클라이언트에서 실행되는 스크립트가 다른 출처의 리소스와 상호작용하게 할 수 있게 하는 프로토콜이다.

 

여기서 말하는 출처는 아래와 같다.

1. a different scheme(HTTP or HTTPS)

2. a different domain

3. a different port

 

예를 들자면 https://www.google.com (80생략) 같은 것이 하나의 출처 라는 것이다.

여기서 https://www.naver.com (80생략) 은, 프로토콜(HTTPS)도 Port(80)도 같지만 도메인이 다르기에 이것은 다른 출처라는 의미이다.

 

CORS는 두개의 다른 출처에 배포된 두 개의 다른 Application이다. 이 두개의 앱이 서로간의 통신을 통해 리소스를 공유하려 할때, Cors는 다른 출처를 가진 요청이기에 해당 요청을 차단하겠다는 의미이다.

 

왜 이것을 하는가?

하는 이유는 자명하게 특별한 이유가 있지 않는한 다른 출처로의 요청은 그렇게 자주 있는 일이 아니기 때문이다.

그렇기에 보안적인 사유로 해당 요청에서 보호하는 기능이라 할 수 있겠다.

 

그런데 이 CORS이슈는 WEB과 WAS가 완전히 분리된 환경에서는 문제가 된다.

PHP등을 사용해 애초에 하나의 서버에서 WEB이 동작한다면 문제가 되지 않지만, 그것이 분리되어 있다면 백엔드(스프링 부트)는 다른 도메인(프론트)에서의 API 요청을 거부한다.

 

가령 localhost로 띄웠을때를 가정한다면,

스프링 부트는 8080, 프론트는 3000으로 동작한다면 각각의 출처(Origin)는 아래와 같다.

 

프론트: http://localhost:3000

백엔드: http://localhost:8080

 

이때 프로토콜과 도메인은 같더라도 Port가 다르기에 다른 출처로 판단하고 CORS는 프론트에서 온 요청을 모두 거부한다.

 

원활한 통신을 위해 출처에 대한 허용(Allow)처리를 하여 프론트 단에서의 요청이 정상적으로 처리가 되도록 조치를 취해야한다.

 

Spring Security에서 제공하는 CORS설정은 아래와 같이 설정이 가능하다.

@Bean
SecurityFilterChain SecurityFilterChain(HttpSecurity http) throw Exception{
  http.cors(cors -> cors.configurationSource(new CorsConfigurationSource(){
  	@Override
        public CorsConfiguration getCorsConfiguration(HttpServletRequest request) {
            CorsConfiguration config = new CorsConfiguration();
            // 허용할 Origin 설정 모두 허용이라면 "*"
            config.setAllowedOrigins(Collections.singletonList("http://localhost:3000"));
            // 자격 증명 허용
            config.setAllowCredentials(true);
            // 허용할 HTTP 메소드 설정, GET만 허용하고 싶다면 "GET"
            config.setAllowedMethods(Collections.singletonList("*")); 
            // 허용할 헤더 설정, Content-Type 헤더만 허용하고 싶다면 "Content-Type"
            config.setAllowedHeaders(Collections.singletonList("*"));
            return config;
    }
  }
})).~~

 

이처럼 CORS 허용을 통해 원활한 통신이 가능하도록 설정을 해야한다.

특히 가장 중요한 SetAllowOrigins 부분은 출처에 대한 부분으로, "*"로 설정시 모든 출처(Origin)에 대해서의 요청을 수락하겠다는 것이니 각별한 주의가 필요하다.