Amazon S3를 사용하여 API Gateway를 프록시로 사용하는 정적 웹 사이트를 호스팅하려면 어떻게 해야 합니까?

해결 방법

HTTP 프록시 통합

정적 웹 사이트에 공개적으로 액세스할 수 있는 경우 HTTP 통합을 사용하여 API에 대한 S3 정적 웹 사이트 URL을 제공하십시오.

먼저 Amazon S3에 정적 웹 사이트를 구성합니다. 그런 다음, API Gateway 콘솔을 사용하여 루트 리소스에 대한 REST API와 메서드를 생성하고 REST API를 배포합니다.

REST API 생성

다음 단계를 완료하십시오.

1. REST API에서 빌드를 선택합니다.
2. API 이름에 REST API의 이름을 입력합니다.
3. 엔드포인트 유형 메뉴에서 엔드포인트 유형을 선택한 다음, API 생성을 선택합니다.
4. 탐색 창의 API 이름 아래에서 리소스를 선택합니다.
5. 작업 메뉴에서 리소스 생성을 선택합니다.
6. 리소스 이름에 이름(예: key)을 입력합니다.
7. 리소스 경로에 경로 파라미터(예: {key})를 입력합니다.
8. 리소스 생성을 선택합니다.

루트 리소스에 대한 메서드 생성

다음 단계를 완료하십시오.

1. 리소스 이름 {key}b를 선택합니다.
2. 작업 메뉴에서 메서드 생성을 선택합니다.
3. {key} 메뉴에서 GET을 선택한 다음, 확인 표시 아이콘을 선택합니다.
4. 통합 유형에서 HTTP를 선택하고 HTTP 프록시 통합 사용을 선택한 다음, HTTP 메서드를 GET으로 유지합니다.
5. 엔드포인트 URL에 **http://BUCKET_NAME.s3-website.REGION.amazonaws.com/{key}**를 입력하고 저장을 선택합니다.

REST API 배포

다음 단계를 완료하십시오.

1. 작업 메뉴에서 API 배포를 선택합니다.

2. 배포 스테이지 메뉴에서 **[새 스테이지]**를 선택합니다.

3. 스테이지 이름에 이름(예:Dev)을 입력합니다.

4. 배포를 선택합니다.

5. 개발 스테이지 편집기에서 API를 테스트할 호출 URL을 기록해 둡니다.

6. 다음 명령을 실행하여 Amazon S3 웹 사이트의 API 프록시를 테스트합니다.

   curl -X GET https://API_ID.execute-api.REGION.amazonaws.com/index.html

   참고: 예제 URL을 호출 URL로 바꿉니다.

AWS 서비스 통합

Amazon S3 정적 웹 사이트 구성

Amazon S3 정적 웹 사이트의 퍼블릭 액세스가 차단된 경우 API 프록시에서만 액세스하도록 웹 사이트를 구성합니다.

다음 단계를 완료하십시오.

1. Amazon S3에서 정적 웹 사이트를 구성합니다.
   참고: 정적 웹 사이트를 구성할 때는 ](https://docs.aws.amazon.com/AmazonS3/latest/userguide/HostingWebsiteOnS3Setup.html#step3-edit-block-public-access)3단계를 건너뛰십시오[. 기본값인 모든 퍼블릭 액세스 차단 설정을 켜진 상태로 유지합니다.

2. API 프록시가 Amazon S3 버킷에만 액세스할 수 있도록 4단계에서 버킷 정책을 수정합니다.

   {
     "Version": "2012-10-17",
     "Statement": [{
         "Sid": "APIProxyBucketPolicy",
         "Effect": "Allow",
         "Principal": {
           "Service": "apigateway.amazonaws.com"
         },
         "Action": "s3:GetObject",
         "Resource": "arn:aws:s3:::BUCKET_NAME/*",
         "Condition": {
           "ArnLike": {
             "aws:SourceArn": "arn:aws:execute-api:REGION:ACCOUNT:API_ID/*/GET/"
           }
         }
     }]
   }

3. Amazon S3 버킷에 대해 GetObject API를 허용하는 AWS Identity and Access Management(IAM) 정책을 생성합니다.

   {
     "Version": "2012-10-17",
     "Statement": [{
       "Effect": "Allow",
       "Action": ["s3:GetObject"],
       "Resource": "*"
     }]
   }

4. IAM 역할을 생성한 다음, 이전 IAM 정책을 연결합니다.

5. 이후 단계에서 사용할 IAM 역할의 ARN을 기록해 둡니다.
   API Gateway에 역할을 부여하려면 IAM 역할에 다음과 같은 신뢰 정책이 포함되어야 합니다.

   {
     "Version": "2012-10-17",
     "Statement": [{
       "Sid": "",
       "Effect": "Allow",
       "Principal": {
           "Service": "apigateway.amazonaws.com"
       },
       "Action": "sts:AssumeRole"
     }]
   }

API Gateway 콘솔을 사용하여 다음 단계를 완료하십시오.

Amazon S3 서비스용 REST API 프록시 생성

다음 단계를 완료하십시오.

1. API 생성을 선택합니다.
2. REST API를 선택한 다음 Build(구축)를 선택합니다.
3. API 이름에 REST API의 이름을 입력합니다.
4. 엔드포인트 유형에서 대부분의 클라이언트 트래픽이 시작되는 위치를 기준으로 엔드포인트 유형을 선택합니다.
   참고: 인터넷에서 액세스하는 퍼블릭 서비스에는 엣지 최적화 엔드포인트를 사용하는 것이 좋습니다. 리전 엔드포인트는 주로 동일한 AWS 리전 내에서 액세스하는 API에 사용됩니다.
5. API 생성을 선택합니다.

루트 리소스에 대한 GET 메서드 생성

Amazon S3 정적 웹 사이트에 대한 프록시 요청의 루트 메서드를 구성하려면 다음 단계를 완료하십시오.

1. 루트 리소스 **"/"**를 선택합니다.
2. 작업 메뉴에서 메서드 생성을 선택합니다.
3. GET을 선택한 다음, 확인 표시 아이콘을 선택합니다.
4. 통합 유형에서 AWS 서비스를 선택합니다.
5. AWS 리전 메뉴에서 리전을 선택합니다.
6. **AWS 서비스 ** 메뉴에서 **Simple Storage Service(S3)**를 선택합니다.
7. AWS 하위 도메인의 경우 필드를 비워 둡니다.
8. HTTP 메서드에서 GET을 선택합니다.
9. 작업 유형에서 경로 재정의 사용을 선택합니다.
10. 경로 재정의에 Amazon S3 버킷 경로(예: BUCKET_NAME/index.html)를 입력합니다.
11. 실행 역할에 IAM 역할의 ARN을 입력합니다.
12. 저장을 선택합니다.

이 설정은 프런트엔드 GET API 요청 **https://your-api-host/stage/**를 GET S3 백엔드 https://your-s3-host/index.html에 통합합니다.

API 리소스 객체 생성

S3 버킷의 특정 객체에 액세스하려면 프런트엔드 API 요청의 객체 경로를 매핑하는 **{object}**라는 이름의 리소스를 생성합니다. 예를 들어, GET https://your-api-host/stage/home.html을 GET S3 백엔드 https://your-s3-host/home.html에 매핑합니다.

다음 단계를 완료하십시오.

1. 리소스를 선택합니다.
2. 작업 메뉴에서 리소스 생성을 선택합니다.
3. 리소스 이름에 이름(예: {object})을 입력합니다.
4. 리소스 경로에 경로(예: {object})를 입력합니다.
5. 리소스 생성을 선택합니다.

리소스에 대한 GET 메서드 구성

다음 단계를 완료하십시오.

1. **{object}**를 선택합니다.
2. 작업 메뉴에서 메서드 생성을 선택합니다.
3. GET을 선택한 다음, 확인 표시 아이콘을 선택합니다.
4. 통합 유형에서 AWS 서비스를 선택합니다.
5. AWS 리전 메뉴에서 리전을 선택합니다.
6. **AWS 서비스 ** 메뉴에서 **Simple Storage Service(S3)**를 선택합니다.
7. AWS 하위 도메인의 경우 필드를 비워 둡니다.
8. HTTP 메서드에서 GET을 선택합니다.
9. 작업 유형에서 경로 재정의 사용을 선택합니다.
10. 경로 재정의에 Amazon S3 버킷 경로(예: BUCKET_NAME/{object})를 입력합니다.
11. 실행 역할에 IAM 역할의 ARN을 입력합니다.
12. 저장을 선택합니다.
13. **리소스 이름 {object}**에서 GET을 선택한 다음, 통합 요청을 선택합니다.
14. URL 경로 파라미터를 확장하고 이름 값 객체 및 다음에서 매핑됨 값 method.request.path.object을 입력한 다음, 확인란을 선택하여 저장합니다.

GET 메서드에 대한 응답 헤더 매핑 설정

브라우저가 콘텐츠 유형의 응답을 성공적으로 처리하도록 백엔드 콘텐츠 유형 헤더 파라미터 값을 프론트엔드 대응값에 매핑합니다.

다음 단계를 완료하십시오.

1. GET을 선택합니다.
2. 리소스 / 아래에서 메서드 응답을 선택합니다.
3. HTTP 상태 200 옆에 있는 화살표를 확장합니다.
4. 200에 대한 응답 헤더에서 헤더 추가를 선택합니다.
5. 헤더 이름을 Content-Type으로 선택하고 확인란을 선택하여 저장합니다.
6. 메서드 실행을 선택합니다.
7. 통합 응답을 선택하고 HTTP 상태 regex 옆의 화살표를 확장합니다.
8. 헤더 매핑을 확장합니다.
9. Content-Type에 매핑 값을 integration.response.header.Content-Type으로 입력합니다.
10. 리소스 /{object} 아래에서 GET 메서드에 대해 1~6단계를 반복합니다.
11. 이 문서의 REST API 배포 섹션에 있는 단계를 반복합니다.

API 프록시 테스트

Amazon S3 정적 웹 사이트의 API 프록시를 테스트하려면 브라우저 또는 curl 명령을 사용하십시오.

루트(/) 리소스

curl -X GET https://API_ID.execute-api.REGION.amazonaws.com/STAGE_NAME/

{Object} resource

curl -X GET https://API_ID.execute-api.REGION.amazonaws.com/STAGE_NAME/home.html

관련 정보

자습서: REST API를 Amazon S3 프록시로 생성

Amazon S3를 사용해 정적 웹 사이트 호스팅

API Gateway에서 REST API 개발

API Gateway에서 REST API를 위한 배포 생성