[AWS SCS] S3 CORS

CORS(Cross-Origin Resource Sharing)란?

CORS(Cross-Origin Resource Sharing)는 웹 브라우저의 보안 메커니즘으로, 다른 Origin(출처) 간의 리소스 요청을 허용하거나 차단할 수 있도록 설계되었습니다. CORS는 웹 브라우저와 서버 간의 보안 협약으로, 특히 정적 웹사이트와 Amazon S3 같은 클라우드 스토리지 간 상호작용에 중요하게 사용됩니다.

---

Origin이란?

Origin은 아래 3가지 요소로 정의됩니다.

• 스키마(프로토콜): HTTP 또는 HTTPS
• 호스트(도메인): www.example.com
• 포트: HTTP의 기본 포트는 80, HTTPS의 기본 포트는 443

예를 들어, https://www.example.com에서는 HTTPS가 스키마, www.example.com이 호스트, 443이 포트로 암시됩니다.

같은 Origin이란 동일한 스키마, 호스트, 포트를 공유하는 경우를 말합니다.

---

CORS 동작 방식

다른 Origin으로 리소스를 요청하는 과정에서 브라우저는 요청을 수행하기 전에 사전 요청(Pre-flight Request) 과정을 거칩니다. 이 과정은 다음과 같이 진행됩니다.

1. 사전 요청(Pre-flight Request)
   브라우저는 요청하려는 대상 서버에 OPTIONS 메서드로 요청을 보냅니다. 이 요청에는 현재 Origin 정보가 포함됩니다.
   Origin: https://www.example.com
   Access-Control-Request-Method: GET
2. 대상 서버의 응답
   대상 서버는 요청을 검토한 뒤, 요청을 허용할지 여부를 CORS 헤더에 명시하여 응답합니다.
   Access-Control-Allow-Origin: https://www.example.com
   Access-Control-Allow-Methods: GET, POST
3. 리소스 요청 처리
   브라우저가 응답된 CORS 헤더를 확인한 후 요청을 진행합니다.

---

Amazon S3에서의 CORS

Amazon S3는 정적 웹사이트 호스팅과 파일 저장을 지원하며, CORS 설정을 통해 다른 Origin에서의 리소스 요청을 허용하거나 차단할 수 있습니다.

사용 예시

1. S3 버킷 구성
   • my-bucket-html: 정적 웹사이트를 호스팅하는 S3 버킷
   • my-bucket-assets: 이미지와 같은 리소스를 저장하는 S3 버킷
2. 리소스 요청 흐름
   • 브라우저가 my-bucket-html에서 index.html 파일을 요청합니다.
   • index.html 파일 내부에서 my-bucket-assets에 저장된 이미지를 요청합니다.
   • 브라우저는 CORS 정책에 따라 my-bucket-assets로 사전 요청을 보내고, S3 버킷이 허용 응답을 반환해야 이미지 요청이 진행됩니다.
3. CORS 설정 예시
   S3 버킷의 CORS 설정은 아래와 같이 구성할 수 있습니다.
   
   [ { "AllowedOrigins": ["https://www.example.com"], "AllowedMethods": ["GET", "POST"], "AllowedHeaders": ["*"] } ]

---

주요 포인트

• CORS 헤더 설정
  다른 Origin에서 요청을 허용하려면 Access-Control-Allow-Origin 헤더를 적절히 구성해야 합니다.
• S3에서의 CORS 활용
  S3 버킷 간 리소스 공유나 정적 웹사이트의 자원 로드에 필수적입니다.
• 웹 브라우저 보안 강화
  CORS는 동일 Origin 정책(Same-Origin Policy)의 확장으로, 보안성을 유지하며 리소스 공유를 가능하게 합니다.

---

마무리

CORS는 웹 애플리케이션 개발과 클라우드 환경에서 자주 사용되는 중요한 개념입니다. 특히, Amazon S3에서의 CORS 설정은 정적 웹사이트와 리소스 간의 통신을 원활히 하는 데 필수적인 역할을 합니다.