Cors

 

Cors

Cors(Cross Origin Resource Sharing)란 교차 출처 리소스 공유로 서로 다른 출처에서 데이터를 송/수신하는 걸 허용하는 정책이다. 우리가 흔히 알고 있는 Cors 에러는 Sop(Same Origin Policy)가 다른 경우 Cors 정책에 위반되므로 브라우저에서 발생시키는 에러다.

 

Sop

Sop(Same Origin Policy)란 한 Origin으로부터 로드된 Document 또는 Script가 다른 Origin의 리소스와 상호작용할 수 있는 방법을 제안하는 보안 메커니즘이다. 즉 같은 Origin들이랑만 데이터를 송/수신할 수 있다.

 

Oirign 

프로토콜과 호스트 그리고 포트 번호를 합친 걸 의미

 

 

Cros 접근 제어 시나리오

1. 단순 요청(Simple Request)

단순 요청이란 사전에 Preflight 요청 없이 바로 요청 보내는 걸 의미하며 다음과 같은 특징이 있다.

• 메서드는 GET / HEAD / POST 중 하나
• Content-Type은 application/x-www-form-urlencoded 또는 multipart/form-data 또는 text/plain 중 하나
• Header는 Accept 또는 Accept-Language 또는 Content-Language 또는 Content-Type 중 하나
• 커스텀 헤더를 추가하지 않는 경우

 

 

2. 사전 요청(Preflight Request)

사전 요청이란 options 메서드를 통해 다른 도메인의 리소스에 요청이 가능(Cors) 한 지 실제 요청(Actual Request)을 보내기 전 확인하는 요청이며 단순 요청의 메서드를 제외(GET / HEAD / POST)한 메서드를 사용해야 한다.

 

2-1. 단순 요청의 경우가 아니라면 Options 메서드를 통해 요청을 보냄

2-2. 서버에서 허용되는 메서드와 헤더 쿠키 허용 여부 등을 응답

2-3. 요청에 대한 응답이 요청을 허용하는 응답이라면 실제 요청(Actual Request)을 보냄

 

Preflight Reqeust 구성 요소

Origin: 요청 출처

Access-Control-Request-Method: 실제 요청의 메서드

Access-Control-Request-Headers: 실제 요청의 추가 헤더

 

Preflight Response 구성 요소

• 응답 코드는 200번 대 여야 하며 바디는 비어있는 게 좋음

 

Access-Control-Allow-Origin: 서버 측 허가 출처

Access-Control-Allow-Methods: 서버 측 허가 메서드

Access-Control-Allow-Headers: 서버 측 허가 헤더

Access-Control-Max-Age: 사전 요청 응답 캐시 기간