어떤 경우에 CORS 문제가 발생하나요?

• 프론트엔드: https://test.com (React, Next.js 등)

• 백엔드 API: https://api.test.com (Spring Boot)

서로 다른 서브도메인이라도 브라우저 기준에서는 cross-origin으로 판단하고,
백엔드 서버가 명시적으로 허용하지 않으면 CORS 에러가 발생합니다.

대표 에러 메시지

Access to XMLHttpRequest at 'https://api.test.com/login' 
from origin 'https://test.com' has been blocked by CORS policy:
No 'Access-Control-Allow-Origin' header is present on the requested resource.

글로벌 CORS 설정 (전체 API에 적용)

@Configuration
public class WebConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**") // 전체 엔드포인트에 적용
            .allowedOrigins("https://test.com") // 허용할 프론트 주소
            .allowedMethods("GET", "POST", "PUT", "DELETE")
            .allowedHeaders("*")
            .allowCredentials(true)
            .maxAge(3600);
    }
}

글로벌 CORS 설정이 아닌 단일 CORS 설정도 가능

@CrossOrigin어노테이션 사용 (단일 컨트롤러/메서드 기준)

@CrossOrigin(origins = "https://test.com", allowCredentials = "true")
@RestController
@RequestMapping("/api")
public class UserController {
    @GetMapping("/profile")
    public User getProfile() {
        // ...
    }
}

• 간단하게 적용 가능

• 컨트롤러 단위로 제어