CORS.. 정말 많이 들어본 단어지만 무슨 내용인지 자세히는 몰랐다. HTTP 헤더에 대해 공부하던 중 본문에 나왔길래 드디어 공부한다 😂
CORS란 Cross-Origin Resource Sharing, 교차 출처 리소스 공유의 줄임말이다. 이는 추가 HTTP헤더를 사용하여 한 출처에서 실행 중인 웹 애플리케이션이 다른 출처의 선택한 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제이다. 웹 애플리케이션은 리소스가 자신의 출처(protocol, domain, port)와 다를 때 교차 출처 HTTP 요청을 실행한다.
🙄 출처가 뭔데?
: 웹 콘텐츠의 출처(Origin)란 접근할 때 사용하는 URL의 scheme(protocol), host(domain), port로 정의된다. 두 객체의 scheme, host, port가 모두 일치하는 경우 같은 출처를 가졌다고 말한다.
일부 작업은 동일 출처 콘텐츠로 제한되나, CORS를 통해 제한을 해제할 수 있다.
http://example.com/app1/index.html
http://example.com/app2/index.html
http://Example.com:80
http://example.com
http://example.com/app1
https://example.com/app2
http://example.com
http://www.example.com
http://myapp.example.com
http://example.com
http://example.com:8080
교차 출처 요청의 예시를 살펴보자.
https://domain-a.com
의 프론트엔드 JavaScript 코드가 XMLHTTPRequest
를 사용하여 https://domain-b.com/data.json
을 요청하는 경우에 대해 알아보자.