Come implementare il Server-Side tracking con GTM su AWS

Vuoi implementare il Server-Side tracking con Google Tag Manager su AWS? Ti stai chiedendo come fare e soprattutto quali sono i costi e le complessità tecniche?

Allora seguimi in questo articolo nel quale ti mostro passo passo come implementare un sistema completo e funzionante di tracciamento lato server usando Google Tag Manager installato su Amazon Web Services tramite il servizio cloud Elastic Beanstalk.

L'articolo è molto tecnico, l'installazione ed il deploy su AWS l'ho fatto ispirandomi all'utilissima guida di Simo Ahava, alla quale ho aggiunto alcune note e rimandi più specifici per l'Italia oltre ad aver usato la configurazione DNS su Cloudflare.

Ma prima di entrare nei tecnicismi facciamo un piccolo passo indietro e cerchiamo di capire perché il server side tracking sta diventando sempre più un prerequisito indispensabile per chi fa attività di marketing online.

La nota del garante sulla privacy

Il 23 Giugno 2022 il garante ha pubblicato una nota ufficiale sul suo portale dal titolo

Google: Garante privacy stop all’uso degli Analytics. Dati trasferiti negli Usa senza adeguate garanzie

Che rimanda e specifica quanto previsto nel Provvedimento del 9 giugno 2022 [9782890] , la cui introduzione è la seguente

Il sito web che utilizza il servizio Google Analytics (GA), senza le garanzie previste dal Regolamento Ue, viola la normativa sulla protezione dei dati perché trasferisce negli Stati Uniti, Paese privo di un adeguato livello di protezione, i dati degli utenti.

Accelerando di fatto la necessità di migrare da Universal Analytics a Google Analytics 4, ne parlo qui

Ed ove possibile iniziare ad implementare un sistema di tracciamento lato server.

La mail di Federico Leva da Helsinki

A seguito della nota del Garante è scoppiato un vero e proprio delirio collettivo sul web da parte di professionisti del settore sul tema GDPR ed Analytics, a questo caos ha contribuito ulteriormente Federico Leva da Helsinki con la sua ormai famosissima mail, ne parlo in questo articolo

Da ciò la necessità di adeguarsi a sistemi di tracciamento più compliant con il GDPR e tra questi ci sono GA4 ed il server side tracking con Google Tag Manager.

In questo articolo ti faccio vedere come implementare server side tracking usando AWS ed il servizio cloud Elastic Beanstalk.

Il Server side tracking con gtm

Ma cosa si intende con Server Side Tracking e perché sta diventando sempre più prerequisito fondamentale per la compatibilità con il GDPR?

Per comprendere meglio le differenze si faccia riferimento a queste due immagini prese dalla documentazione ufficiale Google.

La prima rappresenta lo schema relativo ad una configurazione classica di Google Tag Manager senza il tracciamento lato server.

Questa configurazione richiede l'installazione dello script di Google Tag Manager sul client ed è dal client stesso (browser utente) che vengono attivati i vari tag di Analytics, Conversion Tracking ed altro.

L'attivazione dei vari tag lato client, quindi sul browser, presenta molti svantaggi infatti rallenta il caricamento delle pagine, rende poco sicuri i dati tracciati e mette a rischio il tracking stesso a causa dei problemi sempre più insistenti legati ai cookie.

 

 

Questa invece la nuova configurazione che richiede sempre l'installazione dello script classico di GTM (Web Container) ma che non attiverà direttamente i tag dal browser.

In questa configurazione infatti i vari tag di Analytics, Conversion Tracking ed altro vengono attivati  sul server grazie al nuovo concetto “Client” del Server Container.

La nuova entità “Client” è proprio quella deputata a far dialogare lo script classico di gtm con il nuovo container lato server ed i relativi tag.

I vantaggi di questa configurazione sono facilmente comprensibili: miglior tracciamento server side, zero rischi di perdita dati a causa del browser e dei cookie, maggior velocità di caricamento delle pagine web.

 

Insomma una vera e propria rivoluzione.

Esistono moltissime opzioni per configurare un sistema di tracciamento server, in questo articolo ti farò vedere come farlo usando AWS ed Elastic Beanstalk, ma ho descritto in dettaglio anche la procedura per farlo con Stape.io in questo tutorial

Opzioni Preliminari su Google tag Manager

Per questo tutorial userò i seguenti dati:

• dominio da tracciare : https://www.nodelog.it
• nuovo gtm server : https://tagmanager.nodelog.it
• nuovo gtm server di anteprima: https://debug.tagmanager.nodelog.it

Per cui sostituisci al domino “nodelog.it” il tuo e cominciamo.

La prima cosa da fare è creare un nuovo contenitore Server su Google Tag Manager, se non hai un account gtm puoi farlo da questo link.

Clicca su Crea contenitore

Inserisci il nome del tuo website e seleziona Server

Poi clicca su Crea

Accedi quindi alla sezione Amministrazione > Configura il server di tag e copia il valore come riportato in figura, ti servirà più avanti.

Ora sei pronto, accedi al tuo account AWS.

Richiedi i certificati ssl

La prima cosa da fare è richiedere due certificati ssl per i domini che andremo a creare ossia tagmanager.nodelog.it e debug.tagmanager.nodelog.it.

Clicca su “Richiedi” ed inserisci i due nuovi domini da gestire

Salva, ora i certificati li vedrai nello stato pending.

Accedi quindi al tuo sistema di gestione DNS (nel mio caso è Cloudflare) ed inserisci due nuovi record CNAME con i valori che trovi al fianco di ogni certificato (nome CNAME e valore CNAME)

Ora torna su AWS e verifica che i certificati siano stati correttamente emessi

Ora dovrai creare una zona ospitata (Hosted Zone) su AWS.

Crea una zona ospitata per il dominio di tagging

Dopo aver creato i certificati dovrai creare una zona ospitata per il dominio di tagging, per farlo accedi a Route 53 e crea una nuova zona ospitata.

Grazie alla Hosted Zone potrai creare dei nuovi record di tipo NS e dire cosi a tutti i DNS mondiali che il dominio *.tagmanager.nodelog.it è ora gestito da Amazon Web Service.

Dopo aver cliccato su “Crea Zona Ospitata” inserisci il nome del dominio di tagging

Crea la zona e poi copia i quattro valori associati al record NS

Accedi quindi nuovamente al tuo server di gestione DNS e crea quattro record di tipo NS con i valori appena copiati e con il nome “tagmanager“.

Attendi la propagazione dei DNS, da questo momento in poi potrai fare tutto dalla console AWS senza dover tornare sul pannello di gestione DNS del tuo provider.

Crea l'applicazione per il server di tagging con Elastic Beanstalk

Le operazioni preliminari sono finite, puoi quindi passare alla creazione del server di tagging con Elastic Beanstalk.

Questa operazione prevede prima la creazione di una applicazione,  poi la creazione di due diversi ambienti, uno per il debug/anteprima ed uno per il server vero e proprio.

Cominciamo con il creare l'applicazione accedendo alla pagina di Elastic Beanstalk, clicca su “Create Application”

Inserisci un nome per l'applicazione

e poi seleziona “Docker” come piattaforma

Clicca poi su “Configura più opzioni”

Vai alla fine della pagina e poi clicca su “Annulla“, in questo modo verrà creata l'applicazione e potrai configurarla manualmente.

Attendi qualche istante poi accedi alla sezione “Applicazioni“, dovresti vedere la tua nuova applicazione appena creata.

Ora sei pronto per configurare l'ambiente di anteprima.

Ambiente gtm di Anteprima

Ora che hai creato l'applicazione puoi procedere con la creazione dell'ambiente che verrà utilizzato come anteprima di gtm, clicca quindi sul nome dell'applicazione poi su “Crea un nuovo ambiente”

Lascia Ambiente del server Web e clicca “Seleziona”

Inserisci il nome dell'ambiente di anteprima

Seleziona Docker

Imposta “Carica il tuo codice” e carica il file immagine Dockerrun.aws.json che trovi a questo link

Questo file contiene i dettagli del container Docker per l'installazione di Google Tag Manager server side.

Poi clicca su “Configura più opzioni”

In questo modo potrai configurare in dettaglio l'ambiente.

Modifica le impostazioni del software

Ora accedi alla voce “Software” e clicca su Modifica

Inserisci le variabili ambiente che serviranno al software per capire che il container gtm è adibito all'anteprima, inserisci i seguenti valori

RUN_AS_PREVIEW_SERVER true
CONTAINER_CONFIG      [la stringa copiata da gtm]

Come in figura

Poi clicca su salva

Modifica la Capacità

Ora accedi alla voce “Capacità” e clicca su Modifica

Imposta “Carico Bilanciato” e lascia 1 sia per il minimo che per il massimo

Poi clicca su salva

Modifica il Servizio di Bilanciamento del carico

Ora accedi alla voce “Servizio di Bilanciamento del carico” e clicca su Modifica

Seleziona “Application Load Balancer”

Vai alla voce “Listener” e clicca su “Aggiungi Listener”

Inserisci i dati relativi al listener https come da figura, selezionando il certificato SSL creato in precedenza, infine clicca su Aggiungi

Ora che hai creato i listener vai alla voce “Processi“, dovrai prima modificare il processo per la porta 80 esistente

Inserisci 200 come codice HTTP di controllo dello stato e /healthz come percorso, quindi Salva.

Ora aggiungi un nuovo processo per l'https cliccando su “Aggiungi Processo”

Inserisci i valori https come da figura ed il check sul controllo dello stato da percorso come fatto in precedenza, quindi clicca su “Aggiungi”

Hai terminato la configurazione del bilanciamento di carico (Load Balancer) con check sullo stato del servizio sia per il protocollo http che per il protocollo https

Crea l'ambiente di anteprima

Ora puoi creare l'ambiente di anteprima cliccando su “Crea Ambiente”

Attendi che venga fatto il deploy dell'applicazione e dell'intera infrastruttura (macchina EC2, Load Balancer, Autoscaling, Security Group, …. ) appena creata

Inizialmente l'ambiente sarà nello stato “Pending“, attendi almeno 5 minuti poi verifica nuovamente.

Se hai fatto tutto correttamente dovresti vedere il seguente stato per quanto riguarda il nuovo ambiente appena creato

Bene, hai completato la parte più rognosa! Ora facciamo qualche verifica.

Testa l'ambiente di anteprima

Come prima cosa vediamo se l'ambiente è veramente live e raggiungibile, clicca quindi sulla url generata nel tuo ambiente ed aggiungi la stringa “/healthz”

Questo check lo dovrai fare su protocollo http, quindi non in modalità sicura.

Se tutto è andato per il meglio dovresti ricevere un OK sul tuo browser.

Mappa il Dominio sul server di anteprima

Ora dobbiamo mappare con un nuovo record DNS su AWS l'applicazione appena creata, per farlo accedi nuovamente a Route 53  e seleziona la Zona Ospitata creata in precedenza

Poi clicca su “Crea Record”

Ed inserisci un nuovo record di tipo A con le caratteristiche che vedi in figura.

Ricordati di selezionare “Instrada il traffico a” per abilitare le voci di instradamento all'applicazione appena creata:

• Alias per ambiente Elastic Beanstalk
• Zona di riferimento
• ambiente dell'applicazione

Poi clicca su “Crea record”

Verifica che il nuovo record di tipo A sia presente

Test finali sul server di anteprima

Ora esegui il test finale usando la tua url definitiva per l'ambiente di anteprima ed il protocollo https

se tutto è andato per il meglio dovresti ricevere un ok nella pagina web.

L'ambiente di anteprima è terminato, ora procediamo con la creazione dell'ambiente server vero e proprio.

I passi da seguire sono molto simili, per cui vedremo solo le differenze.

Ambiente gtm Server Side

Ora che hai creato l'applicazione e l'ambiente di anteprima puoi procedere con la creazione dell'ambiente che verrà utilizzato come server di tagging vero e proprio

Quindi torna su Elastic Beanstalk clicca sul nome dell'applicazione creata in precedenza e poi su “Crea un nuovo ambiente” ed inserisci il nome dell'ambiente server

Ora seleziona “Versione Esistente” in quanto hai già caricato il docker file e poi Configura più opzioni

Modifica le impostazioni del software

Come prima cosa procedi con al modifica delle impostazioni del Software ,

dovrai inserire le seguenti variabili d'ambiente

CONTAINER_CONFIG      [la stringa copiata da gtm]
PREVIEW_SERVER_URL    [la url del server di anteprima appena creato]

Come in figura

Poi clicca su salva.

Modifica la Capacità

Modifica poi la capacità

questa volta oltre a selezionare carico bilanciato imposta i valori min = 1 e max = 3 , cosi avrai un ambiente che potrà scalare da un minimo di uno ad un massimo di tre server EC2, tale da supportare carichi importanti.

Clicca su Salva

Modifica il Servizio di Bilanciamento del carico

Modifica ora il servizio di bilanciamento del carico

esattamente come fatto per l'ambiente di debug, per cui inserisci il listener https, inserisci il processo https ed aggiorna i processi per il monitoraggio dell'applicazione.

Crea l'ambiente server

Sei pronto a creare l'ambiente server, anche in questo caso attendi qualche minuto e verifica che il risultato sia il seguente

Testa l'ambiente server

Procedi anche in questo caso con il test da url dell'ambiente server appena creato, aggiungendo sempre /healthz alla fine su protocollo http.

Ora puoi configurare il record A nella hosted zone

Mappa il Dominio sul server di tagging

Come per l'ambiente di anteprima procedi con la creazione di un record di tipo A in route 53, con le seguenti caratteristiche.

Ricorda che in questo caso alla voce record name non devi inserire nulla.

Crea il record e verifica che ci sia anche questo record di tipo A

Test finali sul server di tagging

Ora puoi fare il test usando la url definitiva ed il protocollo https

Se riceverai il valore ok nel tuo browser allora avrai completato la configurazione del server di tagging.

Complimenti! Ottimo lavoro ?

Configurazioni finali

Ci siamo quasi, ora devi solo fare una piccola modifica nei gruppi di autoscaling appena creati.

Modifica ai gruppi di autoscaling

Accedi ai tuo gruppi di autoscaling

Seleziona i gruppi di autoscaling appena creati e per ognuno clicca su modifica alla voce “Controlli di Stato”

Seleziona la voce ELB, poi clicca su Aggiorna

Ci sei, su AWS hai finito.

E' arrivato il momento di tornare su google tag manager per la configurazione finale.

Configurazione finale GTM Server

Torna nuovamente sul contenitore server che avevi creato ad inizio tutorial ed accedi alla voce “Amministrazione” > “Impostazioni Contentore” > “Aggiungi url”

 

ed inserisci la url del tuo nuovo server di tagging (es. https://tagmanager.nodelog.it)

 

Salva e fai una ultimissima verifica cliccando su “Anteprima”

 

Verifica che la url sia effettivamente quella del tuo server di anteprima

Hai concluso la creazione dell'ambiente ed ora puoi cominciare a configurare il tuo  nuovissimo Google Tag Manager lato server con attivatori, variabili e tag.

Buon lavoro!

Costi della soluzione gtm su aws

I costi di una configurazione simile non sono facilissimi da stimare, perché molto dipende dall'autoscaling e dal traffico del tuo website

Mi spiego meglio, se non fai moltissimo traffico potresti rimanere sempre con una sola macchina EC2 t2.micro per l'ambiente server più la macchina EC2 dell'ambiente di anteprima.

Se invece fai molto traffico l'applicativo potrebbe scalare e potresti avere fino a 4 macchine EC2 live di tipo t2.micro.

Inoltre, al costo delle macchine EC2 va aggiunto il costo dell'Elastic Load Balancer e dell'infrastruttura creata da Elastic Beanstalk.

Per cui non è semplicissimo fare una stima, certo è che non è una architettura economica.

Ho fatto dei test in produzione e la mia configurazione su un website con molto traffico e molte azioni di conversione generate generava un costo giornaliero di 1,87$

con una proiezione di circa 56$ / mese.

Conclusioni

Se era tua intenzione implementare un sistema di Server-Side tracking con Google Tag Manager su AWS spero che questo articolo ti sia stato di aiuto.

Come hai potuto vedere è un articolo molto tecnico e con delle complessità legate più all'ambiente cloud AWS che non alla creazione in se dell'applicativo.

Se già sei un esperto di Amazon Web Service non credo che troverai particolari problemi con la configurazione descritta.

Se invece vorresti saperne di più puoi sempre contattarmi e fissare un appuntamento per verificare insieme la possibilità di installare e configurare un ambiente di Tagging Server Side per il tuo website.

I vantaggi, come avrai già potuto intuire sono enormi!

Che te ne pare di questa architettura? Pensi che potresti passare ad un ambiente di server side tagging usando AWS? Preferisci altrre architetture?

Discutiamone insieme nei commenti!