도메인 또는 포트가 다른 서버의 자원을 요청하는 메커니즘

CORS는 브라우저를 통해 서로 다른 두 도메인간의 통신을 할 때, 보안상의 이유로 생길 수 있는 문제인데요. 정보를 제공하는 출처에서 HTTP헤더를 통해 접근해도 괜찮은 도메인들을 명시함으로써 해결할 수 있습니다.

• CORS는 추가 HTTP 헤더를 사용하여, 한 출처에서 실행 중인 웹 애플리케이션이 다른 출처의 선택한 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제
• CORS는 서로 다른 도메인간의 통신에서, 다른 출처의 자원에 대한 접근 권한을 HTTP 헤더를 통해 부여하는 정책, 체제

<aside> 👉🏻 CORS 체제는 브라우저와 서버 간의 안전한 교차 출처 요청 및 데이터 전송을 지원한다. 최신 브라우저는 XMLHttpRequest 또는 Fetch와 같은 API에서 CORS를 사용하여 교차 출처 HTTP 요청의 위험을 완화 한다.

</aside>

• 웹 애플리케이션은 리소스가 자신의 출처(도메인, 프로토콜, 포트)와 다를 때 교차 출처 HTTP 요청을 실행한다

• 브라우저는 보안 상의 이유로, 스크립트에서 시작한 교차 출처 HTTP 요청을 제한한다. (domain-a.com ↔domain-b.com 브라우저 단에서 제한)

• 따라서 다른 출처의 리소스를 불러오기 위해서는, 그 출처에서 교차 출처 리소스 공유에 대한 헤더(CORS)를 응답시 반환 해주어야 한다

CORS는 어떻게 동작하는가?

1. 기본적으로 웹은 다른 출처의 리소스를 요청할 때는 HTTP 프로토콜을 사용하여 요청을 하는데, 이때 브라우저는 요청 헤더 (request header)에 Origin 필드에 요청을 보내는 출처를 담아 전송한다.

2. 서버는 요청에 대한 응답을 하는데, 응답 헤더 (response header)에 Access-Control-Allow-Origin이라는 값에 '이 리소스를 접근하는 것이 허용된 출처'를 내려준다. 이후 응답을 받은 브라우저는 자신이 보냈던 요청의 Origin과 서버가 보내준 응답의 Access-Control-Allow-Origin을 비교해 본 후 이 응답이 유효한 응답인지 아닌지를 결정한다.

→ 이것이 기본적인 CORS 동작의 흐름 → BUT, 이것은 기본적인 흐름일 뿐 모든 CORS 동작의 방식은 아니다.