웹 개발자라면 한번쯤은 봤을 법한 CORS(Cross-Origin Resource Sharing) 정책에 대한 이야기를 해보자.

Definition

CORS는 Cross-Origin Resource Sharing의 줄임말로, 한국어로 직역하면 교차 출처 리소스 공유라고 해석할 수 있다.

브라우저에서는 보안적인 이유로 cross-origin HTTP 요청들을 제한한다.

그래서 cross-origin(교차 출처) 요청을 하려면 서버의 동의가 필요하다.

만약 서버가 동의한다면 브라우저에서는 요청을 허락하고, 동의하지 않는다면 브라우저에서 거절한다.

따라서 CORS 관련 이슈는 모두 CORS 정책을 위반했기 때문에 발생하는 것이다.

Cross-origin

cross-origin이란 다음 중 한 가지라도 다른 경우를 말한다.

1. 프로토콜 : http vs https

2. 도메인 : abc.com vs def.com

3. 포트 번호 : 80 vs 8080

같은 프로토콜, 호스트, 포트를 사용한다면, 그 뒤의 다른 요소는 다르더라도 같은 출처로 인정된다.

반대로 프로토콜, 호스트, 포트 중 하나라도 자신의 출처와 다를경우 브라우저는 정책상 차단하게 된다.

출처를 비교하는 로직은 서버에 구현된 스펙이 아닌 브라우저에 구현된 스펙이다.

따라서 브라우저를 통하지 않고 서버 간에 통신을 할때는 정책이 적용되지 않는다는 말과 같다.

Operation

1. Client에서 Request Header 에 Origin 정보 추가

2. Server는 Response Header에 Access-Control-Allow-Origin 정보 추가

3. Client는 보낸 Origin과 받은 Origin 비교

Source