La nostra integrazione con CloudFront utilizza la soluzione Lambda@Edge di Amazon per fornire un servizio di sala d'attesa che funziona direttamente dalla vostra CDN senza che dobbiate apportare modifiche al codice dell'applicazione o ai server web.

Introduzione


Questo articolo illustra i passaggi necessari per integrare CrowdHandler con la distribuzione CloudFront. Poiché questa integrazione comporta il provisioning dell'infrastruttura nell'account AWS, verranno applicate le tariffe standard di utilizzo di AWS.


Se in qualsiasi momento della guida vi bloccate o avete delle domande, non esitate a contattarci via https://www.crowdhandler.com.

Prerequisiti

  1. Un account CrowdHandler attivo. Se non vi siete ancora iscritti potete farlo qui.
  2. Accesso alla console AWS in cui si trova la distribuzione CloudFront e autorizzazione:
    1. Modificare la distribuzione CloudFront
    2. Pubblicare le funzioni Lambda
    3. Modificare i ruoli IAM.


Come per tutte le nostre integrazioni lato server, si consiglia di integrare con l'ambiente UAT/Staging prima di integrare con il dominio di produzione. 


Passo 1: scaricare il codice di integrazione.


  1. Andare al repository GitHub dell'integrazione di CloudFront.
  2. Inserire la directory dist.
  3. Scaricare i file zip contenuti.


Passo 2: creare la funzione lambda viewerRequest.



AWS richiede che le funzioni lambda@edge siano create nella regione US-East-1 (N.Virgina). 

Le funzioni Lambda@Edge sono distribuite a livello globale, ma devono provenire da questa posizione geografica.


  1. Accedere alla console AWS.
  2. Accedere al servizio AWS Lambda. 
  3. Creare una nuova funzione.
  4. Lasciare le opzioni di creazione delle funzioni impostate su "Autore da zero".
  5. Assegnare un nome alla funzione crowdhandler-viewerRequest
  6. Impostare il runtime su Node.js 14.x
  7. Espandere il menu a tendina del ruolo di esecuzione e prendere nota del ruolo di esecuzione che Lambda creerà. 
  8. Creare la funzione.


Nell'esempio seguente il ruolo di esecuzione è denominato crowdhandler-viewerRequest-role-28dhheno



Passo 3: Configurare le autorizzazioni del ruolo di esecuzione.


  1. Aprire una nuova scheda del browser e accedere alla console di gestione AWS IAM.
  2. Selezionare i ruoli.
  3. Selezionare il ruolo di esecuzione creato al punto 2. 
  4. Selezionare la scheda Relazioni di fiducia.
  5. Fare clic sul pulsante "Modifica relazione fiduciaria". 
  6. Aggiornare il criterio di fiducia per includere il servizio edgelambda.amazonaws.com e salvarlo. 



Passo 4a: Configurare la funzione Lambda viewerRequest.


  1. Tornare alla scheda del browser in cui è stata creata la funzione viewerRequest al punto 2.
  2. Caricare il file viewerRequest.zip scaricato al punto 1.


  3. Fare doppio clic sul file handlerViewerRequest.js per visualizzare il codice sorgente.
  4. Cercare CROWDHANDLER_API_DOMAIN nel codice sorgente e sostituirlo con api.crowdhandler.com.


  5. Cercare CROWDHANDLER_PUBLIC_KEY e sostituirlo con il valore della chiave pubblica di CrowdHandler (si trova nella sezione Account -> API del pannello di controllo amministrativo di CrowdHandler).


  6. Scorrete verso il basso fino alle impostazioni di runtime.
  7. Fare clic su modifica.
  8. Cambiare il nome del gestore in handlerViewerRequest.viewerRequest.
  9. Aggiornare la funzione Lambda facendo clic sul pulsante Deploy.



Passo 4b: (facoltativo) Configurare le impostazioni avanzate.



failTrust (boolean) (default true)

If false, a user that fails to check-in with CrowdHandler's API will be sent to a safety net waiting room until CrowdHandler is able to make a decision on what to do with them. 

If true, users that fail to check-in with CrowdHandler's API will be trusted.

safetyNetSlug (string) (default undefined)

If defined and if failTrust is set to false, this waiting room slug will be used as the safety net room. 

whitelabel (boolean) (default false)

By default, users will be queued on CrowdHandler's wait.crowdhandler.com domain. If whitelabel is set to true, users will be queued on the domain CrowdHandler is protecting. For example, if CrowdHandler has been set up to protect www.example.com, users will be queued on the www.example.com/ch/ path. The /ch/ route does not need to exist in your application. 

Read more about whitelabel waiting rooms here.


  1. Se sono state apportate modifiche alle impostazioni avanzate, aggiornare la funzione Lambda facendo clic sul pulsante Deploy.

Passo 5: distribuire la funzione Lambda viewerRequest su CloudFront.


  1. Aggiornare la pagina (AWS Lambda memorizza le configurazioni del ruolo di esecuzione IAM). 
  2. Selezionare Deploy to Lambda@Edge dal menu a tendina delle azioni.


  3. Selezionate la vostra distribuzione CloudFront dal menu a tendina Distribuzione.
  4. Selezionare il comportamento che si desidera attivare in CrowdHandler. Si consiglia di selezionare *.

Lo schema * attiverà la funzione CrowdHandler per tutte le rotte del sito, ad eccezione di quelle escluse dai comportamenti di CloudFront (vedere la sezione 13). Si consiglia di iniziare con questo schema, a meno che non si sia sicuri che il sito non sarà inondato di traffico verso rotte non protette e non sarà vulnerabile al problema del reindirizzamento descritto qui qui. 

È possibile effettuare ulteriori configurazioni più granulari delle rotte delle sale d'attesa attraverso la console di amministrazione di CrowdHandler.


5. Modificare l'evento CloudFront in richiesta del visualizzatore.

6. Selezionare il riconoscimento.

7. Distribuire.



Passo 6: creare la funzione lambda viewerResponse.


  1. Accedere al servizio AWS Lambda. 
  2. Creare una nuova funzione.
  3. Lasciare le opzioni di creazione delle funzioni impostate su "Autore da zero".
  4. Dare un nome alla funzione crowdhandler-viewerResponse
  5. Impostare il runtime su Node.js 14.x
  6. Espandere l'elenco a discesa del ruolo di esecuzione e selezionare il ruolo di esecuzione di cui si è preso nota al punto 2. 
  7. Creare la funzione.



Passo 7: configurare la funzione Lambda viewerResponse.


  1. Caricare il file viewerResponse.zip scaricato al punto 1.


  2. Scorrete verso il basso fino alle impostazioni di runtime.
  3. Fare clic su modifica.
  4. Cambiare il nome del gestore in handlerViewerResponse.viewerResponse.



Passo 8: distribuire la funzione Lambda viewerResponse su CloudFront.


  1. Selezionare Deploy to Lambda@Edge dal menu a tendina delle azioni.



  2. Selezionate la vostra distribuzione CloudFront dal menu a tendina Distribuzione.
  3. Selezionare lo stesso comportamento scelto al punto 5.
  4. Cambiare l'evento CloudFront in risposta del visualizzatore.
  5. Selezionare il riconoscimento.
  6. Distribuire




I passaggi 9-12 possono essere saltati se non si è impostato whitelabel su true nel passaggio 4b.

Passo 9: creare la funzione Lambda originOverride(solo per la configurazione Whitelabel).


  1. Accedere al servizio AWS Lambda. 
  2. Creare una nuova funzione.
  3. Lasciare le opzioni di creazione delle funzioni impostate su "Autore da zero".
  4. Dare un nome alla funzione crowdhandler-originOverride.
  5. Impostare il runtime su Node.js 14.x
  6. Espandere l'elenco a discesa del ruolo di esecuzione e selezionare il ruolo di esecuzione di cui si è preso nota al punto 2. 
  7. Creare la funzione.



Passo 10: Configurare la funzione Lambda originOverride(solo per la configurazione Whitelabel).


  1. Caricare il file originOverride.zip scaricato al passo 1.


  2. Scorrete verso il basso fino alle impostazioni di runtime.
  3. Fare clic su modifica.
  4. Cambiare il nome del gestore in handlerOriginOverride.originOverride, salvare e aumentare il timeout della funzione a 10 secondi.




Passo 11: Aggiungere il supporto CloudFront whitelabel(solo configurazione whitelabel).


  1. Aprire una nuova scheda del browser e navigare nella console di AWS CloudFront.
  2. Individuare la distribuzione CloudFront e fare clic sull'ID della distribuzione per accedere alla modalità di configurazione. 
  3. Selezionare la scheda Comportamenti.
  4. Aggiungere un nuovo comportamento per lo schema di percorso /ch/*, come mostrato nella schermata seguente, modificando l'origine in modo che corrisponda alla propria.


!!! IMPORTANTE !!!

Quando si completa questo passaggio, è fondamentale che la cache di CloudFront sia abilitata selezionando il criterio di cache mostrato nella schermata. In caso contrario, AWS potrebbe limitare il traffico in situazioni di traffico elevato.


Passo 12: Distribuzione della rotta Whitelabel(solo per la configurazione Whitelabel).

  1. Tornare alla scheda del browser in cui è stata creata la funzione originOverride al punto 9.
  2. Aggiornare la pagina.
  3. Selezionare Deploy to Lambda@Edge dal menu a tendina delle azioni.

  4. Selezionate la vostra distribuzione CloudFront dal menu a tendina Distribuzione.
  5. Selezionare il comportamento /ch/* .
  6. Cambiare l'evento CloudFront in richiesta di origine
  7. Selezionare il riconoscimento.
  8. Distribuire.

Passo 13: aggiungere le rotte di esclusione di CrowdHandler.


CrowdHandler non tenterà automaticamente di accodare i percorsi con le seguenti estensioni di file. 

"avi","css","csv","eot","gif","ico","jpg","js","json","map","mov","mp4","mpeg","mpg","ogg","ogv","ott","pdf","png","svg","ttf","webmanifest","wmv","woff","woff2","xml".

È responsabilità dell'utente omettere i modelli e le rotte che non devono essere accodati. 

Esempi comuni sono:

* Percorsi utilizzati per memorizzare risorse statiche e media, ad esempio /wp-includes/*
* URL di callback creati da fornitori di pagamenti di terze parti. 
* JSON e feed RSS.
  1. Accedere alla console di AWS CloudFront.
  2. Individuare la distribuzione CloudFront e fare clic sull'ID della distribuzione per accedere alla modalità di configurazione.
  3. Selezionare la scheda Comportamenti.
  4. Aggiungere nuovi comportamenti per le rotte che non devono essere soggette alla protezione di Crowdhandler.
Di seguito è riportato un esempio di configurazione per una directory di risorse statiche.

Passo 14: (facoltativo) Aggiungere l'intestazione x-ch-no-bypass.


L'intestazione x-ch-no-bypass può essere configurata per essere inviata al server di origine in CloudFront. È possibile controllare questa intestazione nella propria applicazione per verificare che la richiesta sia passata attraverso CrowdHandler. Esempi di implementazione si trovano nella sezione "Esempi di integrazione" di questo articolo.


  1. Accedere alla console di AWS CloudFront.
  2. Individuare la distribuzione CloudFront e fare clic sull'ID della distribuzione per accedere alla modalità di configurazione.
  3. Selezionare la scheda Origini.
  4. Selezionare l'origine e fare clic su modifica.
  5. Aggiungere un'intestazione personalizzata.


  6. Impostare il nome dell'intestazione su x-ch-no-bypass.
  7. Impostare il valore su una stringa segreta (considerare l'uso di un generatore di password).
  8. Questa intestazione/valore sarà ora inviata all'origine a ogni richiesta.

Fase 15: Completare la configurazione.

CrowdHandler è integrato con la distribuzione CloudFront e ora spetta a voi personalizzare la configurazione di CrowdHandler attraverso la console di amministrazione di CrowdHandler. Ecco alcuni articoli di supporto consigliati che coprono le nozioni di base:

  1. Come iniziare (È possibile ignorare le parti relative all'installazione dell'integrazione Javascript).
  2. Sale d'attesa
  3. Configurazione del dominio