CORS(Cross-Origin Resource Sharing, 교차 출처 자원 공유)

정의

- 웹 브라우저에서 다른 출처의 리소스에 대한 접근을 제어하기 위한 보안 메커니즘

- 웹 애플리케이션이 자신이 로드된 도메인과 다른 도메인에서 리소스를 요청할 때 이를 허용하거나 거부하는 방식

- CORS는 서버에서 설정하는 것이기 때문에 client에서는 완전히 제어할 수 없음

 

작동 방식

1. 프리플라이트 요청 - client가 실제 요청을 보내기 전에 OPTIONS http method를 사용하여 서버에 Preflight 요청

• 서버는 클라이언트의 출처와 요청 메서드, 헤더를 기반으로 요청을 허용할지를 판단

2. 서버 응답 - 서버가 요청을 허용한다면 다음과 같은 응답 헤더를 포함

• Access-Control-Allow-Origin: 허용된 출처 (예: *는 모든 출처를 허용).
• Access-Control-Allow-Methods: 허용된 HTTP 메서드 목록 (예: GET, POST, PUT).
• Access-Control-Allow-Headers: 허용된 요청 헤더 목록 (예: Content-Type, Authorization).
• Access-Control-Max-Age: Preflight 요청의 유효 시간

3. 실제 요청 - 프리플라이트 요청이 허용되면 client에서 서버로 실제 요청 전송

 

 

프리플라이트(Preflight)

정의

- 웹 브라우저가 CORS 정책을 준수하기 위해 서버에 보내는 사전 요청

- 클라이언트가 서버에 실제 요청을 보내기 전에 서버가 특정 HTTP 요청을 허용하는지 확인하는 과정

※ Spring에서 @CrossOrigin({"*"}) 적용 시 → 프리플라이트는 정상적으로 자동 처리됨

(Access-Control-Allow-Origin, Access-Control-Allow-Methods, Access-Control-Allow-Headers가 자동으로 추가)

※ 프리플라이트 관련 문제 발생 시 대부분 OPTIONS 요청에 대한 정상 처리로 해결 가능

 

발생 조건

- http method로 PUT, DELETE, CONNECT, OPTIONS, TRACE, PATCH 사용

- Access-Control-Allow-Headers가 t ext/plain, multipart/form-data, application/x-www-form-urlencoded가 아님

※ Content-type을 application/json를 사용하면 프리플라이트 발생

- 요청에 사용되는 XMLHttpRequestUpload에 하나 이상의 EventListener 등록

 

발생하지 않는 조건 (단순 요청)

- http method로 GET, POST, HEAD 사용

- Accept, Accept-Language, Content-Language, Content-Type 이외의 헤더는 수정 X

- Access-Control-Allow-Headers가 text/plain, multipart/form-data, application/x-www-form-urlencoded

- 요청에 사용된 XMLHttpRequestUpload 객체에 EventListener가 등록 X

- 요청에 ReadableStream 객체가 사용 X