CORS

CORS (Cross-Origin Resource Sharing)

CORS는 추가 HTTP Header를 사용하여, 한 출저(Origin)에서 실행 중인 웹 애플리케이션이 다른 출저(Origin)의 선택한 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제이다.

웹애플리케이션은 리소스가 자신의 출저와 다를 때 교차 출처 HTTP 요청을 실행하는데 보안 상의 이유로, 브라우저는 스크립트에서 시작한 교차 출저 HTTP 요청을 제한한다.

즉, 이 API를 사용하는 웹 애플리케이션은 동일 출저 정책를 따르며, 다른 출처의 리소스를 불러오려면 그 출처에서 올바른 CORS 헤더를 포함한 응답을 반환해야 한다.

Preflight Request

이 처럼, CORS 표준은 웹 브라우저에서 해당 정보를 읽는 것이 허용된 출저를 서버에서 설명할 수 있는 새로운 HTTP헤더를 추가함으로써 동작을한다.

하지만, 서버 데이터에 부수 효과(side effect)를 일으킬 수 있는 HTTP 요청 메서드(GET을 제외한 HTTP 메서드)에 대해 한번에 보내지 않고 OPTIONS 메서드로 프리플라이트”(Preflight)하여 지원하는 메서드를 요청하고, 서버의 허가가 떨어지면 실제 요청을 보내도록 요구한다.

그림 처럼 본 요청을 보내기전에 Preflight 요청으로 Origin : 보내 서버로 부터 Access-Control-Allow-Origin: * 받아와 비교하고 유효한 응답인지 확인하고 유효할 경우 본요청을 보낸다.

헤더	뜻
Access-Control-Request-Method	실제 요청에서 사용될 HTTP 메서드를 나타냄
Access-Control-Request-Headers	브라우저가 실제 요청에 포함할 헤더
Access-Control-Allow-Origin	브라우저에게 현재 도메인과 다른 출처의 리소스 요청을 수락여부, * 로 응답하여 모든 출저에서 요청을 수락한다는 의미를 보낼 수 있다.

Simple Request

모든 요청을 Preflight Request를 보내는 것이 아니다.

단순 요청을 경우 서버가 응답 헤더에 Access-Control-Allow-Origin과 같은 값을 보내면 그 때 브라우저가 CORS 정책 위반 여부를 검사한다.

아래의 경우 Simple Request에 해당한다.

1. GET, HEAD, POST 요청
2. CORS-safelisted request-header로 명시된 (Accept, Accept-Language, Content-Language , Content-Type, …) 헤더외 사용자 임의 header가 존재할 경우
3. Content-Type:
4. application/x-www-form-urlencoded
5. multipart/form-data
6. text/plain

용어

출저 (Origin)

웹 콘텐츠의 Origin은 접근할 때 사용하는 URL의 스킴(프로토콜), 호스트, 포트로 정의한다.

동일 출저 정책 (Same Origin Policy)

동일 출처 정책은 어떤 출처에서 불러온 문서나 스크립트가 다른 출처에서 가져온 리소스와 상호 작용할 수 있는 방법을 제한하는 정책이다. 즉, 출저가 일치할 경우에만 가능하다.

만약 출저가 서로 다를 경우는 교차 출저라고 한다.