Amazon S3에서 CORS를 구성하고 cURL로 CORS 규칙을 확인하려면 어떻게 해야 합니까?

5분 분량

Amazon Simple Storage Service(Amazon S3) 버킷에서 교차 오리진 리소스 공유(CORS) 를 허용하고 싶은데 오류가 발생합니다.

해결 방법

참고: AWS Command Line Interface(AWS CLI) 명령을 실행할 때 오류가 발생하면 AWS CLI의 오류 해결을 참조하십시오. 또한 최신 AWS CLI 버전을 사용하고 있는지 확인하십시오.

Amazon S3 콘솔 또는 AWS Command Line Interface(AWS CLI)를 사용하여 CORS(교차 오리진 리소스 공유) 규칙을 버킷에 적용할 수 있습니다. CORS는 헤더를 사용하여 웹 서버가 다른 오리진에서 요청하는 콘텐츠를 브라우저가 표시할 수 있도록 하는 HTTP의 기능입니다. CORS 규칙으로 구성하지 않은 Amazon S3 버킷에 교차 오리진 요청을 보내는 경우 웹 서버는 CORS 헤더를 반환하지 않습니다. Amazon S3 버킷에 대한 CORS 규칙을 테스트하려면 다음 cURL 명령을 사용하십시오.

curl -i http://mycorsbucket.s3.amazonaws.com/cors-test.html -H "Origin: http://www.example.com"

HTTP/1.1 200 OK
x-amz-id-2: Va106gWx1uUDGbouopXfpjvjHW0VXydI8/VGlraf/62f2vvxtI+iAnmu7lF4MK2B6CxuzReyfRI=
x-amz-request-id: QWNNX1Y0MWFM152H
Date: Thu, 04 Nov 2021 18:52:55 GMT
Last-Modified: Thu, 04 Nov 2021 16:03:50 GMT
ETag: "cd4276d2cd5a2dc8ebcc1e04746680f6"
Accept-Ranges: bytes
Content-Type: text/html
Server: AmazonS3
Content-Length: 55

참고: mycorsbucket을 버킷 이름으로 바꾸고 www.example.com을 콘텐츠를 요청하는 웹 서버의 URL로 바꿉니다.

웹 서버가 원본 웹 사이트에 유사한 요청을 보내는 경우 버킷에서 검색한 콘텐츠가 브라우저에 표시되지 않습니다. 콘텐츠가 표시되도록 하려면 Amazon S3 버킷에 대한 CORS 정책을 구성하십시오. 적절한 헤더가 반환되도록 CORS 정책을 구성합니다. Amazon S3 콘솔 또는 AWS CLI를 사용하여 버킷에 대한 CORS 규칙을 구성할 수 있습니다.

Amazon S3 콘솔을 사용하여 CORS 규칙 구성

Amazon S3 콘솔을 사용하여 버킷에 대한 CORS 규칙을 구성하려면 다음 단계를 수행하십시오.

Amazon S3 콘솔을 엽니다.
버킷을 선택합니다.
권한 탭을 선택합니다.
교차 오리진 리소스 공유 창에서 편집을 선택합니다.

텍스트 상자에 다음 예와 같이 활성화하려는 JSON CORS 규칙을 입력합니다.

[
  {
    "AllowedHeaders": [
      "Authorization"
    ],
    "AllowedMethods": [
      "GET",
      "HEAD"
    ],
    "AllowedOrigins": [
      "http://www.example.com"
    ],
    "ExposeHeaders": [
      "Access-Control-Allow-Origin"
    ]
  }
]

각 CORS 규칙 요소 또는 예제 규칙에 대한 자세한 내용은 CORS 구성 요소를 참조하십시오.

참고: www.example.com을 콘텐츠를 요청하는 웹 서버의 URL로 바꿉니다.

저장을 선택합니다.

AWS CLI를 사용하여 CORS 규칙 구성

AWS CLI를 사용하여 버킷에 대한 CORS 규칙을 구성하려면 다음 명령을 실행합니다.

aws s3api put-bucket-cors --bucket mycorsbucket --cors-configuration '{"CORSRules" : [{"AllowedHeaders":["Authorization"],"AllowedMethods":["GET","HEAD"],"AllowedOrigins":["http://www.example.com"],"ExposeHeaders":["Access-Control-Allow-Origin"]}]}'

참고: mycorsbucket을 버킷 이름으로 바꾸고 www.example.com을 콘텐츠를 요청하는 웹 서버의 URL로 바꿉니다.

CORS 규칙 테스트

CORS 규칙을 테스트하려면 다음과 같이 cURL 명령을 사용합니다.

curl -i http://mycorsbucket.s3.amazonaws.com/index.html -H "Origin: http://www.example.com"

HTTP/1.1 200 OK
x-amz-id-2: d5Jsw1vCf8tR3cMdXrtcTKYgczU/1pjxahnrw7C6jU1fLo8py2Nv2kpeFs8pYPruVZg6Y3JuRUA=
x-amz-request-id: BMCCY18E58B3GBWV
Date: Thu, 04 Nov 2021 19:12:26 GMT
Access-Control-Allow-Origin: http://www.example.com
Access-Control-Allow-Methods: GET, HEAD
Access-Control-Expose-Headers: Access-Control-Allow-Origin
Access-Control-Allow-Credentials: true
Vary: Origin, Access-Control-Request-Headers, Access-Control-Request-Method
Last-Modified: Thu, 04 Nov 2021 16:03:50 GMT
ETag: "cd4276d2cd5a2dc8ebcc1e04746680f6"
Accept-Ranges: bytes
Content-Type: text/html
Server: AmazonS3
Content-Length: 55

참고: mycorsbucket을 버킷 이름으로 바꾸고 www.example.com을 콘텐츠를 요청하는 웹 서버의 URL로 바꿉니다.

CORS 규칙을 올바르게 구성한 경우 200 OK 응답을 받게 됩니다.

CORS 메서드 문제 해결

CORS로 버킷에 액세스할 때 예상치 못한 동작이 발생하는 경우 다음 작업을 시도하십시오.

cURL 명령을 사용하면 -H "Access-Control-Request-Method:" 플래그를 추가하여 특정 CORS 메서드를 사용해 <Method>요청할 수 있습니다. 이 플래그는 테스트할 CORS 메서드를 지정합니다. --request OPTIONS 플래그를 사용하여 해당 요청의 실행 전 검사를 수행합니다.

참고: Amazon S3는 GET, HEAD, PUT, POST 및 DELETE 메서드를 지원합니다.

curl -i http://mycorsbucket.s3.amazonaws.com/cors-test.html -H "Access-Control-Request-Method: POST" --request OPTIONS -H "Origin: http://www.example.com"
HTTP/1.1 403 Forbidden
x-amz-request-id: 190J4Q6222HA2KZ5
x-amz-id-2: 6oEci3qg88OeoLvBGwkN8K9AGdxyVela8ZKxftXMqyWrtZFfiKMrBwpTAeRiOth8amovJMtAAdA=
Content-Type: application/xml
Transfer-Encoding: chunked
Date: Fri, 19 Nov 2021 18:43:38 GMT
Server: AmazonS3

<?xml version="1.0" encoding="UTF-8"?>
<Error><Code>AccessForbidden</Code><Message>CORSResponse: This CORS request is not allowed. This is usually because the evalution of Origin, request method / Access-Control-Request-Method or Access-Control-Request-Headers are not whitelisted by the resource's CORS spec.</Message><Method>POST</Method><ResourceType>OBJECT</ResourceType><RequestId>190J4Q6222HA2KZ5</RequestId><HostId>6oEci3qg88OeoLvBGwkN8K9AGdxyVela8ZKxftXMqyWrtZFfiKMrBwpTAeRiOth8amovJMtAAdA=</HostId></Error>

참고: mycorsbucket을 버킷 이름으로 바꾸고 www.example.com을 콘텐츠를 요청하는 웹 서버의 URL로 바꿉니다.

요청에서 오류가 반환되는 경우 버킷에 CORS 구성이 설정되어 있는지 확인합니다. CORS 규칙에 필요한 메서드를 버킷에 추가했는지 확인하십시오. CORS 구성이 설정된 경우, S3 콘솔의 버킷에 대한 권한 섹션에 CORS 구성을 편집하는 옵션이 표시됩니다.

aws s3api put-bucket-cors --bucket mycorsbucket --cors-configuration '{"CORSRules" : [{"AllowedHeaders":["Authorization"],"AllowedMethods":["GET","HEAD","POST"],"AllowedOrigins":["http://www.example.com"],"ExposeHeaders":["Access-Control-Allow-Origin"]}]}'

참고: mycorsbucket을 버킷 이름으로 바꾸고 www.example.com을 콘텐츠를 요청하는 웹 서버의 URL로 바꿉니다.

업데이트된 CORS 규칙을 테스트합니다. 메서드가 예상대로 작동하면 다음과 같은 응답을 받게 됩니다.

curl -i http://mycorsbucket.s3.amazonaws.com/index.html -H "Access-Control-Request-Method: POST" -X OPTIONS -H "Origin: http://www.example.com"
HTTP/1.1 200 OK
x-amz-id-2: Cx4kuM31KPVE19woEPRRYxF+85vEWkLk8+M0p6BIb72T550njMnmLtjqRgYzuxKelR0f+cxhFqI=
x-amz-request-id: QBSHV46QK43HGW15
Date: Fri, 19 Nov 2021 18:48:21 GMT
Access-Control-Allow-Origin: http://www.example.com
Access-Control-Allow-Methods: GET, HEAD, POST
Access-Control-Expose-Headers: Access-Control-Allow-Origin
Access-Control-Allow-Credentials: true
Vary: Origin, Access-Control-Request-Headers, Access-Control-Request-Method
Server: AmazonS3
Content-Length: 0

참고: mycorsbucket을 버킷 이름으로 바꾸고 www.example.com을 콘텐츠를 요청하는 웹 서버의 URL로 바꿉니다.

선택한 도구를 사용하여 전체 요청 및 응답을 캡처합니다.

Amazon S3가 수신하는 각 요청에 대해 요청의 데이터와 일치하는 CORS 규칙이 있어야 합니다. 요청에 다음 사항이 포함되어 있는지 확인하십시오.

요청에 오리진 헤더가 있는지 확인합니다. 헤더가 누락된 경우 Amazon S3는 요청을 교차 오리진 요청으로 취급하지 않으며 응답에서 CORS 응답 헤더를 전송하지 않습니다.
요청의 오리진 헤더가 지정된 CORSRule의 AllowedOrigins 요소 중 하나 이상과 일치하는지 확인합니다. 오리진 요청 헤더의 체계, 호스트 및 포트 값은 CORSRule의 AllowedOrigins 요소와 일치해야 합니다. 예를 들어, 오리진 http://www.example.com을 허용하도록 CORSRule을 설정했다고 가정합니다. 이렇게 하면 요청의 https://www.example.com 및 http://www.example.com:80 오리진이 구성에서 허용된 오리진과 일치하지 않습니다.
Access-Control-Request-Method에 지정한 요청 또는 실행 전 요청의 메서드가 동일한 CORSRule의 AllowedMethods 요소 중 하나인지 확인합니다.
실행 전 요청에 Access-Control-Request-Headers 헤더가 포함된 경우, CORSRule에 Access-Control-Request-Headers 헤더의 각 값에 대한 AllowedHeader 항목이 포함되어 있는지 확인합니다.

Amazon S3에서 CORS를 구성하고 cURL로 CORS 규칙을 확인하려면 어떻게 해야 합니까?

해결 방법

Amazon S3 콘솔을 사용하여 CORS 규칙 구성

AWS CLI를 사용하여 CORS 규칙 구성

CORS 규칙 테스트

CORS 메서드 문제 해결

관련 정보

관련 비디오

관련 콘텐츠