CORS (Cross-Origin Resource Sharing) 이해하기
CORS는 추가 HTTP 헤더를 사용하여, 한 출처(Origin)에서 실행 중인 웹 애플리케이션이 다른 출처의 선택한 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제입니다.
1. 배경: 동일 출처 정책 (SOP)
웹 브라우저는 기본적으로 동일 출처 정책(Same-Origin Protocol, SOP)을 따릅니다. 이는 잠재적으로 해로운 문서를 분리함으로써 공격받을 경로를 줄이는 중요한 보안 메커니즘입니다. * Origin의 구성: 프로토콜(http/https), 호스트(domain.com), 포트(80/443)가 모두 같아야 동일 출처로 간주됩니다.
2. CORS가 필요한 이유
최근 웹 서비스는 여러 도메인에 걸쳐 리소스를 가져오는 경우가 많습니다. (예: my-site.com에서 api.other-site.com의 데이터를 호출) 브라우저는 보안상 이를 차단하지만, CORS 설정을 통해 안전하게 허용할 수 있습니다.
3. 작동 원리: 예비 요청 (Preflight Request)
브라우저는 실제 요청을 보내기 전, OPTIONS 메서드를 사용하여 서버에 안전한지 확인하는 예비 요청을 보냅니다.
- 클라이언트: "나 이런 요청 보낼 건데 허용해줄래? (Origin: my-site.com)"
- 서버: "응, 내 리소스는
my-site.com에서 써도 돼! (Access-Control-Allow-Origin: my-site.com)" - 브라우저: 허용 확인 후 실제 데이터를 요청합니다.
4. 해결 방법
서버 측 응답 헤더에 다음과 같은 설정을 추가해야 합니다:
* Access-Control-Allow-Origin: 허용할 출처 (특정 도메인 또는 *)
* Access-Control-Allow-Methods: 허용할 HTTP 메서드 (GET, POST, PUT 등)
* Access-Control-Allow-Headers: 허용할 헤더 목록