[CORS] 교차 출처 리소스 공유 (CORS) 와 해결 방법(with Spring)

2023-03-30

---

사진: Unsplash 의 Alex Geerts

---

1. 정의 

 

Mdn web doc에서 설명하는  교차 출처 리소스 공유(Cross-Origin Resource Sharing, CORS) 정의는 "추가 HTTP 헤더를 사용하여, 한 출처에서 실행 중인 웹 애플리케이션이 다른 출처의 선택한 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제입니다. "  쉽게 표현하면 A와 B 두 개의 웹 서버에서 자원을 공유하여 접근하는 이론입니다. 다만 브라우저들은 보안상의 이유로 오리진 리소스가 다른 요청을 보내는것을 제한하게 됩니다. 

 

https://developer.mozilla.org/ko/docs/Web/HTTP/CORS

 

구체적으로 설명하면,

메인 서버를 A(https://domain-a.com) 라고 가정해 보자. 그러면 메인 리소스의 출처는 https://domain-a.com 가 되고 이외의 주소는 모두 다른 리소스로 취급한다.  

 

어떤 경우에 메인리소스로 인지 하는지 아래 테이블을 보면 쉽게 알 수 있을 것이다.

 

리소스 출처	일치여부	설명
https://domain-a.com	O	정확히 일치한다.
https://domain-a.com:433	O	https는 암묵적으로 443 포트를 사용한다.
https://domain-a.com/hello	O	오리진 리소스는 포트까지만 확인한다.
https://domain-a.com:80	X	포트 정보가 다르다.
http://domain-a.com	X	스키마 정보가 다르다.
https://domain-b.com	X	도메인 정보가 다르다.

 

위의 테이블에서 확인할 수 있듯이 스키마 / 도메인 / 포트까지 일치하면 동일한 오리진 리소스로 인식하며, 이 중 하나라도 다르게 되면 동일한 출처에서 리소스를 가져오는 정책인 SOP (Same-Origin Policy)에 위배되어 CORS 오류가 발생하게 된다.

---

2. 해결방법

 

spring에서 이를 해결하는 간단한 방법이 있는 방법은 아래와 같다.

 

import com.source.plusutil.enums.returnUrl.ReturnUrl
import org.springframework.context.annotation.Configuration
import org.springframework.web.servlet.config.annotation.CorsRegistry
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer

@Configuration
open class WebConfig : WebMvcConfigurer {
    override fun addCorsMappings(registry: CorsRegistry) {
        registry.addMapping("/CORS 허용 URL/**")
                .allowedOrigins("CORS요청을 보내는 URL ex) https://domain-b.com/")
                .allowedMethods("GET", "POST", "PUT", "DELETE")
                .allowedHeaders("*")
                .allowCredentials(true)
                .maxAge(3600)
    }
}

 

 스프링에서 제공하는 라이브러리인 CorsRegistry를 사용하면, 쉽게 CORS 요청에 대하여 일부 URL을 허용해 줄 수 있게 된다. 이외에도 프록시 서버를 두는 방법도 있다.

---

메인 이미지 출처 : 사진: Unsplash의Alex Geerts