<aside>
💡 도대체 CORS는 무엇이고, 어떤프로세스를 가지는 것일까?
</aside>
이번에는 나를 애먹게 했던, CORS에 대해 알아보려고 한다.
CORS의 정의
- CORS(Cross-Origin-Resource-Sharing): 교차 출처 리소스 공유
- 추가 HTTP헤더를 이용하여, 한 출처에서 실행중인 웹 어플리케이션이 다른 출처의 선택한 자원에 접근할
수 있는 권한을 부여해 주도록 브라우저에 알려주는 체제
(출처: https://developer.mozilla.org/ko/docs/Web/HTTP/CORS)
- 리소스가 자신의 출처(도메인, 프로토콜, 포트)와 다를 때, 웹 에플리케이션은 교차 출처 HTTP 요청을 실행
CORS의 프로세스
CORS의 프로세스는 크게 simple request인 것과 그렇지 않은 것으로 나눌 수 있다.
- Simple Requests
클라와 서버가 간단한 통신을 하고, CORS 헤더를 사용하여 권한을 처리.
→ res.header에 Access-Control-Allow-Origin: * 을 넣어 권한 허락
Simple Requests는 여러가지 조건을 만족해야 하며, 조건들중 가장 첫번째는 메소드가
GET, HEAD, POST중 하나여야한다. 자세한 사항은 아래 mdn을 참고하자.
(https://developer.mozilla.org/ko/docs/Web/HTTP/CORS)
- 프리플라이트 요청(OPTIONS)
OPTIONSmethod 통해 다른 도메인의 리소스로 HTTP 요청을 보내 실제 요청이 전송하기 안전한지 확인.
허락이 된다면, 그때 진짜 요청을 서버에 보냄.
CORS의 옵션설정
옵션 설정은 다음 링크를 참조하기 바란다.