Implementazione

• Creazione di una nuova API REST

  a. Nella Console di gestione AWS, fai clic su Servizi quindi seleziona API Gateway nella sezione Servizi applicazione.
  b. Scegli Crea API.
  c. Seleziona Nuova API e specifica WildRydes in Nome API.
  d. Verifica che Ottimizzato per l'edge sia selezionato nel menu a discesa Tipo di endpoint. Nota: questa opzione è ideale con i servizi pubblici accessibili tramite Internet. Gli endpoint regionali in genere vengono utilizzati per le API a cui si accedere principalmente dalla stessa regione AWS.
  e. Scegli Crea API.

• Creazione di un'autorizzazione del bacino di utenza di Cognito.

  Amazon API Gateway può utilizzare i token JWT restituiti dai pool di utenti Cognito per autenticare le chiamate API. In questa fase configurerai un'autorizzazione per la tua API per utilizzare il pool di utenti creato nel Modulo 2.

  Nella console di Amazon API Gateway, crea una nuova autorizzazione del pool di utenti Cognito per la tua API. Configuralo con i dettagli del pool di utenti creato nel modulo precedente. Puoi testare la configurazione nella console copiando e incollando il token di autorizzazione presentato dopo aver effettuato l'accesso tramite la pagina /signin.html del tuo sito Web attuale.
  

  a. Nell'API appena creata, scegli Autorizzazioni.

  b. Seleziona Crea nuova autorizzazione.

  c. Digita WildRydes nel campo Nome autorizzazione.

  d. Seleziona il tipo Cognito.

  e. Nel menu a discesa Regione in Bacino di utenza Cognito, seleziona la regione in cui è stato creato il bacino d’utenza nel modulo 2 (per impostazione predefinita è selezionata la regione corrente).

  f. Digita WildRydes (o il nome assegnato al bacino di utenza ) nel campo di input Bacino d’utenza Cognito.

  g. Immettere Autorizzazione come Origine token.

  h. Scegli Crea.

  
  Verifica della configurazione dell'autorizzazione

  j. Apri una nuova scheda del browser e passa a /ride.html nel dominio del sito Web.

  k. Se vieni reindirizzato alla pagina di accesso, accedi con l'utente creato nell'ultimo modulo. Sarai reindirizzato a /ride.html.

  l. Copia il token di autorizzazione dalla notifica nella pagina /ride.html,

  m. Torna alla scheda in cui hai appena creato il protocollo di autorizzazione.

  n. Fai clic su Test nella parte inferiore della scheda per il protocollo di autorizzazione.

  o. Incolla il token di autorizzazione nel campo Token autorizzazione nella finestra a comparsa.

  Fai clic sul pulsante Test e controlla che il codice di risposta sia 200 e che le richieste per gli utenti siano visualizzate.

• Creazione di una nuova risorsa e di un nuovo metodo

  Crea una nuova risorsa chiamata /ride nell'API. Quindi crea un metodo POST per quella risorsa e configuralo per utilizzare un'integrazione del proxy Lambda supportata dalla funzione RequestUnicorn creata nel primo passaggio di questo modulo.

  a. Nel riquadro di navigazione sinistro, fai clic su Risorse nell'API WildRydes.

  b. Nel menu a discesa Operazioni scegliere Crea risorsa.

  c. Digita ride nel campo Nome risorsa.

  d. Verifica che l'opzione Percorso risorsa sia impostata su ride.

  e. Seleziona Abilita CORS API Gateway per la risorsa.

  f. Fai clic su Crea risorsa.

  g. Con la risorsa /ride appena creata selezionata, dal menu a discesa Operazioni seleziona Crea metodo.

  h. Seleziona POST dal nuovo menu a discesa visualizzato, quindi fai clic sul segno di spunta.

  i. Seleziona Funzione Lambda come tipo di integrazione.

  j. Seleziona la casella Utilizza integrazione proxy Lambda.

  k. Selezionare la regione da utilizzare per Regione Lambda.

  l. Inserire il nome della funzione creata nel modulo precedente, RequestUnicorn, nel campo Funzione Lambda.

  m. Scegli Salva. Nota: se si verifica un errore che segnala che la funzione non esiste, verificare che la regione selezionata corrisponda a quella utilizzata nel modulo precedente.

  n. Quando viene richiesto di autorizzare Amazon API Gateway a richiamare la funzione, seleziona OK.

  o. Seleziona la scheda Richiesta metodo.

  Seleziona l'icona della matita accanto a Autorizzazione.

  q. Seleziona l'autorizzazione WildRydes del pool di utenti di Cognito dall'elenco a discesa e fai clic sull'icona con il segno di spunta.

• Distribuzione dell'API

  Nella console di Amazon API Gateway, scegliere Actions (Operazioni), Deploy API (Distribuisci API). Verrà chiesto di creare una nuova fase. Utilizza "prod" come nome della fase.

  a. Nell'elenco a discesa Operazioni, seleziona Distribuisci API.
  b. Seleziona Nuova fase nell'elenco a discesa Fase implementazione.
  c. Specifica prod nel campo Nome fase.
  d. Scegli Implementa.
  e. Prendi nota del valore di URL chiamata. Verrà utilizzato nella sezione successiva.
  

• Aggiorna la configurazione del sito Web

  Aggiorna il file /js/config.js nella distribuzione del sito Web per includere l'URL di chiamata della fase appena creata. Copia l'URL di chiamata direttamente dalla parte superiore della pagina dell'editor di fasi nella console di Amazon API Gateway e incollalo nella chiave _config.api.invokeUrl del file /js/config.js dei siti. Assicurati che quando aggiorni il file di configurazione, il file contenga ancora gli aggiornamenti effettuati nel modulo precedente per il pool di utenti Cognito.

  a. Apri il file config.js in un editor di testo.
  b. Aggiorna l'impostazione invokeUrl nella chiave api del file config.js. Utilizza il valore del campo URL chiamata per la fase di implementazione creata nella sezione precedente.

  Di seguito è disponibile un esempio di file config.js completo. Tenere presente che i valori reali del file saranno diversi:
  

  window._config = {
  
      cognito: {
  
          userPoolId: 'us-west-2_uXboG5pAb', // e.g. us-east-2_uXboG5pAb         
  
          userPoolClientId: '25ddkmj4v6hfsfvruhpfi7n4hv', // e.g. 25ddkmj4v6hfsfvruhpfi7n4hv
  
          region: 'us-west-2' // e.g. us-east-2 
  
      }, 
  
      api: { 
  
          invokeUrl: 'https://rc7nyt4tql.execute-api.us-west-2.amazonaws.com/prod' // e.g. https://rc7nyt4tql.execute-api.us-west-2.amazonaws.com/prod, 
  
      } 
  
  };

  Code snippet copied

  Copia

  c. Salva il file modificato e inseriscilo nel repository Git in modo che sia distribuito automaticamente nella console Amplify.
  

  $ git push
  

  Code snippet copied

  Copia
• Convalida l'implementazione

  Nota: è possibile che si verifichi un ritardo tra l'aggiornamento del file config.js nel bucket S3 e il momento in cui il contenuto aggiornato è visibile nel browser. Devi inoltre assicurarti di svuotare la cache del browser prima di eseguire le seguenti fasi.

  a. Consulta /ride.html nel dominio del sito Web.
  b. Se vieni reindirizzati alla pagina di accesso, accedi con l'utente creato nel modulo precedente.
  c. Una volta caricata la mappa, fai clic su un punto qualsiasi per impostare una posizione di incontro.
  d. Seleziona Unicorno richiesta. Dovrebbe essere visualizzata una notifica nella barra laterale destra che informa dell'arrivo di un unicorno e quindi l'icona dell'unicorno che vola fino al punto di incontro.