cross-origin resource sharing, 교차 출처 리소스 공유 : 한 출처에서 실행 중인 웹 애플리케이션이 다른 출처의 선택한 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제
- 웹 브라우저에서 해당 정보 읽기가 허용된 출처를 HTTP 헤더에 추가하며 동작된다.
동작 방식
- CORS 브라우저가 OPTIONS 메서드로 preflight해 지원하는 메서드를 요청
- 서버 허가(쿠키, HTTP 인증 등 인증 정보를 요구할 수도 있다)
- 실제 요청을 보냄
simple request
CORS preflight(교차 출처 HTTP 요청 전 보내는 예비 요청, OPTIONS 메소드가 사용된다)를 요구하지 않는다.
preflighted request
OPTIONS 메소드를 통해 예비 요청을 보내 실제 요청이 전송하기에 안전한지 확인한다.
- preflighted request 후 리다이렉트가 발생하면 오류 메세지가 나타날 수 있다.
- 리다이렉트를 방하기 위해 서버측 동작을 변경하거나 단순 요청이 되도록 요청을 변경하는 것으로 해결할 수 있다.
third-party cookies
CORS 응답에 설정된 쿠키에는 일반적인 third party cookie 정책이 적용된다.
SOP (same-origin policy,동일 출처 정책)
다른 출처의 리소스 사용을 제한하는 보안 방식
- 두 URL의 port,protocol,host가 모두 같아야 동일 출처이다.
CORS를 사용하는 요청
- XMLHttpRequest, Fetch API 호출
- 웹 폰트(css 내
@font-face에서 교차 도메인 폰트 사용시) - WebGL 텍스처
- drawImage()를 사용해 캔버스에 그린 이미지/비디오 프레임
- 이미지로부터 추출하는 CSS Shapes