팀 프로젝트를 본격적으로 진행하면서 앞으로는 프론트엔드와 협업을 하게될 예정이다. 이 때 CORS 에러를 종종 보게된다하여 잘은 모르지만 정리해보았다!
CORS란Cross-Origin Resource Sharing, 교차 출처 리소스 공유의 약자이다.
서로 출처가 다른 웹 애플리케이션에서 자원을 공유하는 것을 말한다.
여기서 출처는 '프로토콜://도메인:포트' 이다.
만약 프론트엔드와 백엔드의 URL이 같아도 포트가 다르면 CORS 문제가 발생한다는 뜻이다.
프론트엔드와 백엔드의 출처가 다르면 CORS 에러를 자주 보게 된다.
브라우저는 보안상의 이유로 교차 출처 Http요청을 제한한다.
이를 해결하기 위해선 백엔드에 CORS 관련 설정을 해주어야한다.
스프링 시큐리티에서 CorsConfigurationSource 클래스를 만들고 내부에 CorsConfiguration을 세팅하면 된다.
CORS는 HttpSecurity의 cors() 메서드로 설정할 수 있다. 그리고 CorsConfigurationSource를 통해 CORS의 속성을 정의해 줄 수 있다.
security를 사용한다면 복잡한 설정이 필요한 것 같진 않은데,,
문제 상황에 놓이면 더 자세히 알아봐야겠다.