본문 바로가기
HTTP

Cross-Origin Resource Sharing (CORS)

by 즐겁게살자 2021. 7. 4.
728x90

 

  • CORS는 브라우저가 현재 로드된 origin(도메인과 포트)에서 다른 origin의 resource가 로드되는 것을 허용하는지에 대한 정책을 말한다. 

  • 여기서 origin을 굳이 번역 하자면 리소스의 "출처" 라고 할 수 있다. origin 의 범주에는 도메인 뿐 아니라 포트도 들어간다.

  • 예를 들어 www.mypage.com:8090 이라는 도메인을 가진 사이트에서 www.mypage.com:8091 에서 제공하는 html을 cors 정책정의 없이 그냥 호출 한다면 cors 보안 정책에 어긋나게 되어, 브라우저 자체에서 리소르 로드를 차단한다.

  • javascript나 이미지, csss등 resource들의 호출이 브라우저상에서 얼마든지 도용할 수 있는 문제가 있으므로 서버-클라이언트resource를 공유하겠다는 통신 규약을 http 헤더에 추가하여 리소스를 공유하게 하는 보안 정책이다.

CORS 정책에 위배 되지 않기 위해서는 3가지 방식이 있다. 

단순 요청(Simple Request), 프리플라이트(Preflighted Request)인증정보를 포함한 요청(Credentialed Request)

 

위 3가지 중 한가지 전략 조건에 해당된다고 판단되면 cors 에 위배 되지 않는 것으로 판단하고 리로스 접근이 가능해 진다.

세가지 방식들에 대한 조건들은 다루지 않겠다.(MDN 문서 참고)

오늘 목적은 Spring Boot에서 특정 사이트에서 resource를 호출시 cors에 위배되지 않게 하기 위한 방법을 기록 하기 위함이다.

 

1. WebConfig 에 설정 하기

@Configuration
public class WebConfig implements WebMvcConfigurer {

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("http://localhost:8080");
    }
}

2. Controller 에 설정 하기

@CrossOrigin(origins = "http://localhost:8080")
@PostMapping("/test")
public ResponseEntity<String> test() {
	return new ResponseEntity<>("aaaa", HttpStatus.OK);
}

 


테스트

 

1. 리소스를 호출 하는 application 생성 (http://localhost:8080)

2. 리소스를 제공하는 application 생성 (http://localhost:8090/test)

3. http://locaㅣhost:8080 화면에서 콘솔을 열고 fetch 로 'http://localhost:8090/test'를 호출 하면 cors 에러가 노출 된다.

4. http://localhost:8090/test mapping 메소드에 'http://localhost:8080' url에게 리소스 접근을 허용한다는 설정 추가

5. @CrossOrigin 적용 후 정상 작동 되는 것을 확인해 볼 수 있다.

댓글