Come faccio a usare Amazon S3 per ospitare un sito web statico che utilizzi Gateway API come proxy?

Risoluzione

Integrazione proxy HTTP

Se il sito web statico è accessibile al pubblico, utilizza l'integrazione HTTP e fornisci l'URL del sito web statico di S3 per API.

Innanzitutto, configura un sito web statico su Amazon S3. Quindi, utilizza la console Gateway API per creare una REST API e un metodo per la risorsa root e distribuisci la REST API.

Creazione di una REST API

Completa i seguenti passaggi:

1. In REST API scegli Crea.
2. In Nome API, inserisci un nome per la REST API.
3. Nel menu Tipo di endpoint, scegli il tipo di endpoint, quindi seleziona Crea API.
4. Nel pannello di navigazione, scegli Risorse sotto al nome dell'API.
5. Nel menu Azioni, scegli Crea risorsa.
6. In Nome risorsa, inserisci un nome, ad esempio chiave.
7. In Percorso risorsa, inserisci un parametro di percorso, ad esempio {key}.
8. Scegli Crea risorsa.

Creazione del metodo per la risorsa root

Completa i seguenti passaggi:

1. Scegli il nome della risorsa {key}b.
2. Nel menu Azioni, scegli Crea metodo.
3. Nel menu {key}, scegli GET, quindi seleziona l'icona del segno di spunta.
4. In Tipo di integrazione, scegli HTTP, seleziona Utilizza integrazione proxy HTTP, quindi in Metodo HTTP mantieni l'impostazione GET.
5. In URL endpoint, inserisci http://BUCKET_NAME.s3-website.REGION.amazonaws.com/{key}, quindi scegli Salva.

Implementazione della REST API

Completa i seguenti passaggi:

1. Nel menu Azioni, scegli Implementa API.

2. Nel menu Fase della distribuzione, scegli [Nuova fase].

3. In Nome fase, inserisci un nome, ad esempio Dev.

4. Scegli Distribuzione.

5. Da Dev Stage Editor, prendi nota dell'URL di richiamo per testare la tua API.

6. Esegui il comando seguente per testare il proxy API per il sito web Amazon S3:

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

   Nota: sostituisci l'URL di esempio con l'URL di richiamo.

Integrazione dei servizi AWS

Configurazione del sito web statico di Amazon S3

Se l'accesso pubblico al sito web statico di Amazon S3 è bloccato, configura il sito web in modo che sia accessibile solo dal proxy API.

Completa i seguenti passaggi:

1. Configura un sito web statico su Amazon S3.
   Nota: quando configuri il sito web statico, ignora il passaggio 3. Mantieni attiva l'impostazione predefinita Blocca tutto l'accesso pubblico.

2. Modifica la policy del bucket nel passaggio 4 per consentire al proxy API di accedere solo al bucket Amazon S3:

   {
     "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. Crea una policy AWS Identity and Access Management (AWS IAM) per consentire l'API GetObject per il bucket di Amazon S3:

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

4. Crea un ruolo IAM, quindi allega la policy IAM precedente.

5. Prendi nota dell'ARN del ruolo IAM per utilizzarlo in un passaggio successivo.
   Il ruolo IAM deve contenere la seguente policy di attendibilità per consentire a Gateway API di assumere il ruolo:

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

Utilizza la console Gateway API per completare i seguenti passaggi.

Creazione di un proxy REST API per il servizio Amazon S3

Completa i seguenti passaggi:

1. Scegli Crea API.
2. Scegli REST API, quindi seleziona Crea.
3. In Nome API, inserisci un nome per la REST API.
4. In Tipo di endpoint scegli il tipo di endpoint in base alla provenienza della maggior parte del traffico client.
   Nota: è consigliabile utilizzare endpoint ottimizzati per l'edge per i servizi pubblici a cui si accede da Internet. Gli endpoint regionali vengono utilizzati principalmente per le API a cui si accede dalla stessa Regione AWS.
5. Scegli Crea API.

Creazione del metodo GET per la risorsa root

Per configurare il metodo root per le richieste proxy ai siti web statici di Amazon S3, completa i seguenti passaggi:

1. Seleziona la risorsa root "/".
2. Nel menu Azioni, scegli Crea metodo.
3. Scegli GET, quindi seleziona l'icona del segno di spunta.
4. Per Tipo di integrazione, scegli Servizio AWS.
5. Nel menu Regione AWS, scegli la Regione.
6. Nel menu Servizio AWS, scegli Simple Storage Service (S3).
7. In Sottodominio AWS, mantieni il campo vuoto.
8. In Metodo HTTP seleziona GET.
9. In Tipo di operazione, scegli Utilizza sostituzione percorso.
10. In Sostituzione percorso, inserisci il percorso del bucket di Amazon S3, ad esempio BUCKET_NAME/index.html.
11. In Ruolo di esecuzione, inserisci l'ARN del ruolo IAM.
12. Scegli Salva.

Questa configurazione integra la richiesta API GET frontend https://your-api-host/stage/ nel backend S3 GET https://your-s3-host/index.html.

Creazione di un oggetto risorsa API

Per accedere a oggetti specifici da un bucket S3, crea una risorsa denominata {object} che esegua la mappatura del percorso dell'oggetto nella richiesta API frontend. Ad esempio, associa GET https://your-api-host/stage/home.html al backend S3 GET https://your-s3-host/home.html.

Completa i seguenti passaggi:

1. Scegli Risorse.
2. Nel menu Azioni, scegli Crea risorsa.
3. In Nome risorsa, inserisci un nome, ad esempio {object}.
4. In Percorso risorsa, inserisci un percorso, ad esempio {object}.
5. Scegli Crea risorsa.

Configurazione di un metodo GET per la risorsa

Completa i seguenti passaggi:

1. Seleziona {object}.
2. Nel menu Azioni, scegli Crea metodo.
3. Scegli GET, quindi seleziona l'icona del segno di spunta.
4. Per Tipo di integrazione, scegli Servizio AWS.
5. Nel menu Regione AWS, scegli la Regione.
6. Nel menu Servizio AWS, scegli Simple Storage Service (S3).
7. In Sottodominio AWS, mantieni il campo vuoto.
8. In Metodo HTTP, scegli GET.
9. In Tipo di operazione, scegli Utilizza sostituzione percorso.
10. In Sostituzione percorso, inserisci il percorso bucket Amazon S3, ad esempio BUCKET_NAME/{object}.
11. In Ruolo di esecuzione, inserisci l'ARN del ruolo IAM.
12. Scegli Salva.
13. In Nome risorsa {object}, scegli GET, quindi seleziona Richiesta di integrazione.
14. Espandi Parametri del percorso URL, inserisci un oggetto valore nome e un valore mappato da method.request.path.object, quindi seleziona la casella di controllo per salvare.

Impostazione delle mappature di intestazione della risposta per il metodo GET

Associa il valore del parametro dell'intestazione del tipo di contenuto del backend alla controparte frontend, in modo che il browser elabori correttamente la risposta con il tipo di contenuto.

Completa i seguenti passaggi:

1. Scegli GET.
2. In Risorse /, scegli Risposta metodo.
3. Espandi la freccia accanto a Stato HTTP 200.
4. In Intestazioni di risposta per 200, scegli Aggiungi intestazione.
5. Scegli il Nome dell'intestazione come Tipo di contenuto, quindi seleziona la casella di controllo per salvare.
6. Scegli Esecuzione metodo.
7. Scegli Risposta di integrazione, quindi espandi la freccia accanto a Espressione regolare stato HTTP.
8. Espandi Mappature intestazioni.
9. In Content-Type, inserisci il valore di mappatura come integration.response.header.Content-Type.
10. Ripeti i passaggi da 1 a 6 per il metodo GET in Risorsa /{object}.
11. Ripeti i passaggi nella sezione Implementazione della REST API.

Test del proxy API

Per testare il proxy API per il sito web statico di Amazon S3, utilizza un browser o un comando curl:

Risorsa root (/)

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

Risorsa {Object}

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

Informazioni correlate

Tutorial: Create a REST API as an Amazon S3 proxy (creazione di una REST API come un proxy Amazon S3)

Hosting a static website using Amazon S3 (Hosting di un sito web statico mediante Amazon S3)

Develop REST APIs in API Gateway (Sviluppo di REST API in Gateway API)

Create a deployment for a REST API in API Gateway (Creazione di una distribuzione per una REST API in Gateway API)