web study/배경지식

CORS와 SOP란? Spring security와 MVC에 적용하는 법

65살까지 코딩 2022. 2. 13. 11:09
728x90
반응형

CORS는 SOP를 기반으로 하고 있기 때문에 SOP를 먼저 이해해야한다.

 

SOP는 Single Origin Policy의 약자로 간단히 말하면 동일 출처 정책이다. 

하나의 Origin을 정해놓고 Orgin과 동일한 출처의 리소스만 상호작용을 허용하는 정책이다.

Origin은 URI스키마, Hostname, port로 이루어진다. 

SOP를 사용하는 이유는 만약 클라이언트가 브라우저에서 한 사이트에 로그인을 한후 쿠키에 로그인 인증에 필요한 값을 저장한후 같은 브라우저에서 악성사이트에 접속하게되면 악성사이트가 로그인페이지에 요청을 보내 정보를 털 수 있다. 하지만 SOP는 같은 Origin만을 허용해주기 때문에 악성사이트에서 보낸 요청에는 CORS에러가 작동하도록 한다.

 

CORS란 Cross Origin Resourse Sharing의 약자로 위와 같은 error를 해결해주는 방법이다. 프론트엔드와 백엔드가 협업을 하게될 때 프론트엔드 분들과 ip주소가 달라지기 때문에 프론트 분들이 백엔드 서버에 잘 접근할 수 있도록 CORS를 설정해주어야 한다. (프론트 분들의 Origin을 Allowed해주면 됨)

CORS는 SimpleRequest와 preflighted request로 나뉘게 된다.

 

SimpleRequest는 3가지 조건이 충족되어야한다

  1. Method 방식이 GET, POST, HEAD
  2. POST일 경우 content-type이 application/x-form-urlencoded, multipar/form-data, text/plain이 셋중 하나여야 한다.
  3. Header에 Origin Request Header가 추가되어 전달되기 때문에 CORS 헤더에서 이를 받아주어야 한다.

 

PrefilghtedRequest방식은 SimpleRequest가 아닐 경우 적용되는데 

과정을 살펴보면

  1. 요청을 보낼떄 OriginRequest Header, Access-Controler-Request-Method, Access-Control-Request-Header를 포함하여 전달하고
  2. 서버는 허용된 메소드 및 헤더를 지정하여 응답을 보내고
  3. 헤더와 메소드가 통과되면 CORS요청을 보낸다.
  4. 서버측에서 CORS설정을 잘 했다면 SOP에서 난 에러를 해결할 수 있다.

 

Spring Security와 MVC에 적용하기 

@Override
    protected void configure(HttpSecurity http) throws Exception {


        http.csrf().disable();
        http.authorizeRequests()
               	//...
                .requestMatchers(CorsUtils::isPreFlightRequest).permitAll()
                .and().cors()
               //...
    }

    @Bean
    public CorsConfigurationSource configurationSource(){
    	//Cors설정 객체 생성
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        //열어줄 Origin 설정
        corsConfiguration.addAllowedOrigin("http://localhost:3000");
        //열어줄 Header 설정
        corsConfiguration.addAllowedHeader("*");
        //열어줄 Method 설정
        corsConfiguration.addAllowedMethod("*");
        //정확히는 모르겠지만 권한은 열어줌
        corsConfiguration.setAllowCredentials(true);

		//뒤에 api작성하는 부분들인 것 같음
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", corsConfiguration);
        return source;


    }

Controller에서 다음과 같이 설정

@Controller
//열어줄 Origin작성
@CrossOrigin(origins = "http://localhost:3000", maxAge = 3600)

 

 

 

 

728x90
반응형