CORS(Cross-Origin Resource Sharing)는 다른 출처(Origin)의 리소스에 접근할 수 있는 권한을 부여하는 HTTP 헤더 기반 메커니즘이다. 브라우저의 동일 출처 정책(SOP)을 완화한다.
동일 출처 정책 (Same-Origin Policy)
출처(Origin) = 프로토콜 + 도메인 + 포트
https://example.com:443 → 기준 출처
https://example.com:443/page → 같은 출처 ✓
https://api.example.com → 다른 출처 ✗ (서브도메인)
http://example.com → 다른 출처 ✗ (프로토콜)
https://example.com:8080 → 다른 출처 ✗ (포트)
CORS 헤더
서버 응답 헤더:
Access-Control-Allow-Origin: https://frontend.com
Access-Control-Allow-Methods: GET, POST, PUT
Access-Control-Allow-Headers: Content-Type, Authorization
Access-Control-Allow-Credentials: true
사전 요청 (Preflight)
비단순 요청 (PUT, DELETE, 커스텀 헤더 등):
1. OPTIONS 요청 (Preflight):
OPTIONS /api/data HTTP/1.1
Origin: https://frontend.com
Access-Control-Request-Method: PUT
2. 서버 응답: 허용 여부
3. 실제 요청 전송
서버 설정 (Node.js)
javascript
const cors = require('cors');
app.use(cors({
origin: 'https://frontend.com',
methods: ['GET', 'POST', 'PUT', 'DELETE'],
credentials: true
}));
관련 개념
- •HTTP/HTTPS — CORS 헤더 전달 기반
- •REST API — CORS 설정이 필요한 API
- •XSS — SOP/CORS로 방어하는 공격
참고문헌
- •MDN Web Docs — CORS
- •Fetch API Standard (WHATWG)
