프론트 엔드와 미니 프로젝트를 진행하던 중
백엔드 코드를 배포하고 전달해줬는데 에러가 난다는 연락을 받았다.
Postman으로 테스트 했을 때 아무 문제 없었기 때문에 이게 CORS 설정의 문제인가? 하는 생각이 딱 들었는데 안그래도 cors에러 라는게 뜬다길래 바로 적용해봤다🙂
@Bean
@Order(SecurityProperties.BASIC_AUTH_ORDER)
public SecurityFilterChain filterChain(HttpSecurity http) throws Exception {
http.cors(); //cors 활성화
}
SecurityConfiguration 클래스 안에 securityFilterChain 이라는 security 디폴트 설정으로 설정된 필터에 cors를 활성화 시켜줬다.
//Cors 설정
@Bean
public CorsConfigurationSource corsConfigurationSource() {
CorsConfiguration configuration = new CorsConfiguration();
configuration.addAllowedOrigin("*");
configuration.addAllowedHeader("*");
configuration.addAllowedMethod("*");
configuration.addExposedHeader("*");
configuration.setAllowCredentials(true);
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
source.registerCorsConfiguration("/**", configuration);
return source;
그리고 SecurityConfiguration 클래스 안에 CorsConfigurationSource를 작성해서 Cors를 설정해주면 된다.
*CORS 모두 허용하는 방법
addAllowedOrigin("*");
도메인이 다른것을 허용
addAllowedHeader("*");
허용하는 request header 추가
addAllowedMethod("*");
허용하는 http 메서드(get/post/put/delete) 추가
addExposedHeader("*");
노출할 response header 추가
setAllowCredentials(true);
내 서버가 응답할 때 json 자바스크립트 허용
참고로
Security와 관련한 서블릿 필터도 실제로는 연결된 여러 필터들로 구성 되어 있다.
이러한 모습 때문에 Chain(체인)이라는 표현을 쓰고 있으며, 해당 필터들의 역할과 흐름을 알고 있어야 필터의 커스터마이징을 할 수 있다.
나중에 Security와 관련된 필터 구성도 알아보고 정리해둬야겠다 : )