Nozioni di base su AWS

Creazione di un'applicazione Web di base

Distribuzione di un'applicazione Web e maggiore interattività con un'API e un database

In questo modulo distribuirai la tua funzione serverless mediante API Gateway.

Introduzione

In questo modulo utilizzeremo Amazon API Gateway per creare un'API RESTful che ci consenta di richiamare la funzione Lambda da un client Web (in genere si riferisce al browser Web di un utente). API Gateway fungerà da livello intermedio tra il client HTML creato nel Modulo 1 e il back-end serverless creato nel Modulo 2.

Avrai modo di approfondire i seguenti aspetti

  • Creazione di una nuova API utilizzando API Gateway
  • Definizione dei metodi HTTP (Hypertext Transfer Protocol) nell'API
  • Attivazione di una funzione Lambda da un'API
  • Abilitazione di CORS in un'API per il relativo utilizzo da un sito Web
  • Test di un'API creata con API Gateway dalla Console di gestione AWS

Concetti chiave

API RESTful: REST sta per "Representational State Transfer" ed è un modello architetturale utilizzato per la creazione di servizi Web. API sta per "Application Program Interface". Pertanto, un'API RESTful è l'interfaccia in cui viene implementato il modello architetturale.

Metodi di richiesta HTTP: i metodi HTTP sono progettati per abilitare le comunicazioni tra client e server. Metodi come GET o PUT, definiti dal protocollo HTTP, vengono utilizzati per indicare l'azione da compiere su una risorsa.

CORS: il meccanismo CORS (Cross Origin Resource Sharing, condivisione di risorse tra le origini) utilizza intestazioni HTTP per indicare a un browser di consentire l'esecuzione di una data applicazione Web in un'origine (dominio) e disporre dell'autorizzazione per accedere a risorse selezionate da un server in un'origine diversa.

Edge Optimized (Edge ottimizzato): una risorsa che utilizza l'infrastruttura globale di AWS per servire meglio i client in tutto il mondo.

 Tempo richiesto per il completamento

5 minuti

 Servizi utilizzati

Implementazione

  • Creazione di una nuova API REST
    1. Accedi alla Console di API Gateway.
    2. Fai clic sul pulsante arancione "Crea API".
    3. Nella casella della REST API fai clic sul pulsante arancione "Crea".
    4. In "Scegli il protocollo", seleziona REST.
    5. In "Crea nuova API", seleziona Nuova API.
    6. Nel campo corrispondente al nome dell'API, digita HelloWorldAPI.
    7. Nell'elenco a discesa "Tipo di endpoint", seleziona "Edge ottimizzato" (nota: gli endpoint con edge ottimizzato sono i migliori per i client distribuiti in più aree geografiche. Sono una buona scelta per i servizi pubblici accessibili tramite Internet. Gli endpoint regionali in genere vengono utilizzati per le API cui si accede principalmente dalla stessa regione AWS).
    8. Fai clic sul pulsante blu "Crea API". Le impostazioni dovrebbero assomigliare a quelle indicate sulla schermata seguente:
    Full Stack tutorial API settings
  • Creazione di una nuova risorsa e di un nuovo metodo
    1. Nel riquadro di navigazione a sinistra, fai clic su "Risorse" nell'API HelloWorld.
    2. Con la risorsa "/" selezionata, fai clic su "Crea metodo" dal menu a discesa Azione.
    3. Seleziona POST dal nuovo menu a discesa visualizzato, quindi fai clic sul segno di spunta.
    4. Seleziona Funzione Lambda come tipo di integrazione.
    5. Digita HelloWorldFunction nel campo "Funzione".
    6. Fai clic sul pulsante blu "Salva".
    7. Dovresti visualizzare un messaggio in cui viene comunicato che stai concedendo all'API in fase di creazione l'autorizzazione a richiamare la funzione Lambda. Fai clic sul pulsante "OK".
    8. Con il metodo POST appena creato selezionato, scegli "Abilita CORS" dal menu a discesa Azione.
    9. Lascia selezionata la casella di controllo POST e fai clic sul pulsante blu "Abilita CORS e sostituisci le intestazioni CORS esistenti".
    Full Stack tutorial EnableCORS

    10. Dovresti visualizzare un messaggio in cui viene richiesto di confermare le modifiche apportate al metodo. Fai clic sul pulsante blu "Sì, sostituisci i valori esistenti".

    Full Stack tutorial ConfirmMethodChanges
  • Distribuzione dell'API
    1. Nell'elenco a discesa "Operazioni", seleziona "Distribuisci API".
    2. Seleziona la "[nuova fase]" nell'elenco a discesa "Fase distribuzione".
    3. Immetti dev per "Nome fase".
    4. Scegli "Distribuisci".
    5. Copia e salva l'URL accanto a "Richiama URL" che sarà necessario nel Modulo 5.
  • Convalida dell'API
    1. Nel riquadro di navigazione a sinistra, fai clic su "Risorse".
    2. I metodi per le nostre API adesso saranno elencati a destra. Fai clic su "POST".
    3. Fai clic sul piccolo fulmine blu.
    4. Incolla quanto riportato di seguito nel campo "Corpo richiesta":
    {
        "firstName":"Grace",
        "lastName":"Hopper"
    }

    5. Fai clic sul pulsante blu "Test".

    6. A destra dovresti visualizzare una risposta con Codice 200.

    7. Ottimo! Abbiamo creato e testato un'API in grado di richiamare la nostra funzione Lambda.


Architettura dell'applicazione

Il Modulo 3 è completato. Rivediamo la nostra architettura:

full-stack amplify console arch diagram module 3

Abbiamo aggiunto API Gateway e lo abbiamo collegato alla funzione Lambda esistente. Adesso, possiamo attivare la funzione con una chiamata API. Non siamo ancora in grado di generare tale chiamata dal client Web. Prima aggiungeremo la nostra tabella di dati nel Modulo 4, quindi collegheremo tutto nel Modulo 5.

Questo modulo è stato utile?

Grazie
Facci sapere cosa ti è piaciuto.
Spiacenti di non esserti stati d'aiuto
C'è qualcosa di obsoleto, ambiguo o approssimativo? Aiutaci a migliorare questo tutorial con il tuo feedback.

Creazione di una tabella di dati