통합검색

AWS

AWS S3 리소스에 대한 CORS(크로스도메인) 설정 방법

  • 2023.10.05 16:51:24


 

S3에 저장된 이미지 리소스를 외부 사이트 웹페이지 등에서 사용 할 때
웹페이지의 도메인과 S3 endpoint의 도메인이 달라 크로스도메인(CORS) 오류가 발생하여 리소스가 로드되지 않는 경우
S3 콘솔에서 CORS 를 설정하여 특정 도메인의 크로스도메인 접근을 허용할 수 있다.



[!]AWS S3 버킷 관리 콘솔[/!]

AWS - S3 - 버킷 선택 - 권한 - CORS(Cross-origin 리소스 공유)
로 이동하여 [편집] 버튼을 클릭하여 관리 팝업을 연 다음 아래와 같 이 입력한다.




[!]CORS 설정 (JSON)[/!]
 
AWS S3 에서는 JSON으로 CORS 설정이 가능하여 아래 구문을 복사한 뒤
적절히 수정하여 적용한다.
 
[
    {
        "AllowedHeaders": [
            "*"
        ],
        "AllowedMethods": [
            "GET",
            "PUT",
            "POST",
            "DELETE"
        ],
        "AllowedOrigins": [
            "https://허용할도메인1.com",
            "http://허용할도메인2.com"
        ],
        "ExposeHeaders": []
    }
]


[!]CORS 설정 (XML)[/!]
 
대부분의 Object Storage 서비스는 S3 CORS 설정 방법과 동일하나,
XML 구문만 지원하는 서비스도 간혹 있는데,
XML의 경우 아래와 같이 설정한다.
 
<CORSConfiguration>

 <CORSRule>
   <AllowedOrigin>https://허용할도메인1.com</AllowedOrigin>
   <AllowedMethod>PUT</AllowedMethod>
   <AllowedMethod>POST</AllowedMethod>
   <AllowedMethod>DELETE</AllowedMethod>
   <AllowedHeader>*</AllowedHeader>
 </CORSRule>

 <CORSRule>
   <AllowedOrigin>http://허용할도메인2.com</AllowedOrigin>
   <AllowedMethod>PUT</AllowedMethod>
   <AllowedMethod>POST</AllowedMethod>
   <AllowedMethod>DELETE</AllowedMethod>
   <AllowedHeader>*</AllowedHeader>
 </CORSRule>

 <CORSRule>
   <AllowedOrigin>*</AllowedOrigin>
   <AllowedMethod>GET</AllowedMethod>
 </CORSRule>

</CORSConfiguration>
리스트