기본적으로 웹 브라우저는 보안상의 이유로 서로 다른 도메인 간의 요청을 차단합니다.
이를 동일 출처 정책(Same-Origin-Policy) 이라고 합니다. CORS는 Cross Origin Resource Sharing의 약자로, 이러한 제한을 완화하여 특정 조건하에 서로 다른 도메인 간의 자원 공유를 허용합니다.
여기서 Origin은 출처를 의미하며, Protocol (예: https)
+ Host (예: www.naver.com)
+ (생략 가능) Port (예: 443)
의 조합을 말합니다.
Origin이 같으면 CORS 에러가 발생하지 않습니다.
Origin이 다르면 자원 요청시 CORS 에러가 발생하게 됩니다.
https://www.example.com // 프론트엔드 서버
https://api.example.com // 백엔드 서버
CORS 에러는 스프링 부트에서 WebMvcConfigurer
를 구현한 클래스의 addCorsMappings
메서드 내의 설정을 통해 해결할 수 있습니다.
@Configuration
public class CustomWebMvcConfig implements WebMvcConfigurer {
private static final String API_PATH_PATTERN = "/api/**";
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping(API_PATH_PATTERN) // 이 경로 요청에 대해 CORS 설정을 적용
.allowedOrigins(
AppConfig.getSiteFrontUrl() // 허용된 출처
)
.allowedMethods("*") // 모든 HTTP 메서드를 허용
.allowedHeaders("*") // 모든 헤더를 허용
.allowCredentials(true); // 자격증명을 포함한 요청을 허용
}
}
이와 같이 설정하면 특정 출처에서 서버의 자원을 안전하게 공유할 수 있습니다.
ref.
https://dev-dobim.tistory.com/74
https://java-man.tistory.com/18