Come evidenziato nei precedenti capitoli di questo manuale le notifiche push attive sulle App mobile e sulle PWA di Passweb utilizzano i servizi messi a disposizione dalla piattaforma Google Firebase.

Per poter attivare questo sistema di notifiche è quindi indispensabile, per prima cosa, configurare correttamente l’integrazione tra il proprio sito Passweb e Firebase seguendo la procedura qui di seguito indicata.

Per informazioni più aggiornate si consiglia comunque di fare sempre riferimento all’apposita documentazione presente in rete e fornita da Google stesso.

• Accedere alla console di Firebase (https://console.firebase.google.com/) utilizzando il proprio account Google

• Creare un nuovo progetto cliccando per questo sul pulsante “Aggiungi Progetto”

• Assegnare un nome al progetto che si intende realizzare (campo “Nome Progetto”) oppure selezionare, dal relativo menu a tendina, uno dei progetti già presenti all’interno della propria google developer console (si potrebbe pensare, ad esempio, di utilizzare anche lo stesso progetto creato per attivare la Api Key necessaria per l’abilitazione della mappa nativa su sistemi Android).

• Completare la creazione del progetto selezionando come paese “Italia” e cliccando sul pulsante Aggiungi Firebase / Crea Progetto
• Una volta completata la creazione del progetto, cliccando sul pulsante Continua verremo automaticamente ridiretti all’interno della console di amministrazione dove dovremo indicare ora le tipologie di App da integrare con i servizi Firebase.

Considerando che l’App Passweb potrà essere attivata tanto su dispositivi Android quanto su dispositivi iOS, e che il sistema di notifiche push potrà essere gestito anche a livello di Progressive Web App e quindi di “normale” browser web, sarà necessario, ovviamente, selezionare, in sequenza, tutte e tre le opzioni indicate in figura.

INTEGRAZIONE FIRBASE PER SISTEMI iOS

• Cliccare sul pulsante “Aggiungi Firebase alla tua app iOS” e compilare i campi presenti nella successiva maschera come di seguito indicato:

ID Bundle iOS: nome del pacchetto di compilazione dell’applicazione

(chiedere a Passepartout il nome corretto da inserire all’interno di questo campo)

ATTENZIONE! E’ necessario utilizzare lo stesso nomeapp utilizzato anche per la configurazione delle API relative alla gestione delle mappe Android (per maggiori informazioni in merito si veda anche il precedente capitolo di questo manuale)

Nickname app (facoltativo): nickname dell’ App utilizzato, eventualmente, nella console di Firebase per identificare univocamente l’App in esame

ID App store (facoltativo): codice identificativo dell’App all’interno dell’Apple Store.

Tale parametro, come indicato, è del tutto facoltativo e, eventualmente, potrà essere inserito solo dopo aver pubblicato l’App sullo store di Apple

• Cliccare sul pulsante “Registra App”

• Scaricare e salvare in locale il file di configurazione GoogleService-info.plist cliccando sul pulsante evidenziato in figura

Cliccare quindi sul pulsante “Avanti” in maniera tale da passare allo step 3

• Lasciare inalterati i dati richiesti agli step3, 4 e 5 e completare quindi la configurazione cliccando semplicemente sul pulsante “Avanti” presente in corrispondenza di ciascuno di questi step

ATTENZIONE! Nel caso in cui, in corrispondenza dell’ultimo passaggio, Firebase dovesse tentare di collegarsi con l’App Passweb cliccare sul pulsante “Salta questo passaggio”

• Accedere al menu di configurazione dell’App Passweb e caricare il file GoogleService-info.plist salvato al punto C in corrispondenza del parametro “GoogleService-info.plist per iOS” presente all’interno della sezione “Impostazioni Applicazione – Notifiche Firebase”

INTEGRAZIONE FIRBASE PER SISTEMI ANDROID

• Cliccare sul pulsante “Aggiungi Firebase alla tua app Android”

Nel caso in cui sia già stato creato il progetto per l’App iOS (secondo quando indicato nei punti precedenti) cliccare invece sul pulsante “AGGIUNGI UN’ALTRA APP” evidenziato in figura.

Verrà così visualizzata una maschera in cui poter selezionare la tipologia di App da aggiungere al progetto Firebase.

Selezionare, anche in questo caso, la voce “Aggiungi Firebase alla tua app Android”

• Compilare i campi presenti nella successiva maschera come di seguito indicato:

Nome pacchetto Android: nome del pacchetto di compilazione dell’applicazione

(chiedere a Passepartout il nome corretto da inserire all’interno di questo campo)

ATTENZIONE! E’ necessario utilizzare lo stesso nomeapp utilizzato anche per la configurazione delle API relative alla gestione delle mappe Android (per maggiori informazioni in merito si veda anche il precedente capitolo di questo manuale)

Nickname app (facoltativo): nickname dell’ App utilizzato, eventualmente, nella console di Firebase per identificare univocamente l’App in esame

Certificato SHA-1 per la firma di debug (facoltativo): lasciare il campo vuoto

• Cliccare sul pulsante “Registra App”

• Scaricare e salvare in locale il file di configurazione google-services.json cliccando sul pulsante evidenziato in figura

Cliccare quindi sul pulsante “Avanti” in maniera tale da passare allo step 3

• Lasciare inalterati i dati richiesti allo step 4 completare quindi la configurazione cliccando semplicemente sul pulsante “Avanti” presente in corrispondenza degli step rimanenti

ATTENZIONE! Nel caso in cui, in corrispondenza dell’ultimo passaggio, Firebase dovesse tentare di collegarsi con l’App Passweb cliccare sul pulsante “Salta questo passaggio”

• Accedere al menu di configurazione dell’App Passweb e caricare il file google-services.json salvato al punto d in corrispondenza del parametro “Google-Service.json per android” presente all’interno della sezione “Impostazioni Applicazione – Notifiche Firebase”

• Tornare alla console di amministrazione di Firebase, cliccare sull’icona raffigurante tre puntini in verticale presente in corrispondenza del progetto relativo all’App Android, e selezionare dal relativo menu la voce “Impostazioni”

• Cliccare sul pulsante “Aggiungi Impronta Digitale” presente nella parte bassa della maschera di gestione delle impostazioni dell’App Android

• Compilare il campo “Impronta digitale certificato” inserendo al suo interno la stringa relativa al certificato SHA1 (chiedere a Passepartout)

Cliccare sul pulsante “Salva”

INTEGRAZIONE FIRBASE PER APPLICAZIONI WEB (PWA)

• Cliccare sul pulsante “Aggiungi Firebase all’applicazione web”

Nel caso in cui sia già stato creato il progetto per l’App iOS o Android (secondo quando indicato nei punti precedenti) cliccare invece sul pulsante “AGGIUNGI UN’ALTRA APP” evidenziato in figura.

Verrà così visualizzata una maschera in cui poter selezionare la tipologia di App da aggiungere al progetto Firebase.

Selezionare, anche in questo caso, la voce “Aggiungi Firebase all’applicazione web”

• Copiare il valore del parametro messagingSenderId presente all’interno della maschera evidenziata in figura ed inserirlo nell’omonimo campo Passweb presente all’interno della sezione “Impostazioni Applicazione – Notifiche Firebase”

• Aprire il menu “Settings” cliccando sull’icona raffigurante una piccola rotellina posta nella parte alta della pagina e selezionare la voce “Impostazioni Progetto”

• Portarsi nella sezione “Cloud Messaging”

• Copiare il contenuto del campo “Chiave Server” ed inserirlo in corrispondenza del parametro “Web Api Key” presente all’interno della sezione “Impostazioni Applicazione – Notifiche Firebase”

• Restare all’interno del menu “Cloud Messaging”, portarsi nella parte bassa della pagina (sezione “Configurazione web”) e cliccare sul pulsante “Genera Coppia di Chiavi”

• Una volta collegati i servizi firebase all’App Android, iOS e alla PWA è poi necessario abilitare un account di servizio da utilizzare per l’invio delle notifiche push sui vari dispositivi.

Per fare questo accedere ancora una volta alle impostazioni di configurazione del proprio progetto Firebase (menu “Settings – Impostazioni Progetto”) e portarsi questa volta all’interno della sezione “Account di Servizio”

• Cliccare sul pulsante “Genera nuova chiave privata”

• Verrà quindi chiesto di salvare localmente un file .json contenente la chiave appena generata.
• Aprire il file salvato al punto precedente con un normale editor di testi e copiare integralmente il suo contenuto all’interno del campo “Google Firebase Sdk Json” presente nella maschera di configurazione dell’ App Passweb (sezione “Notifiche Firebase”)

• Come ultimo passaggio è necessario abilitare le API Firebase di Google all’interno della propria developer console.

Accedere quindi alla developer console di Google (https://console.developers.google.com/apis/library/fcm.googleapis.com ) utilizzando il proprio account

• Nel caso in cui non siano presenti altri progetti crearne un nuovo cliccando, ad esempio, sul pulsante evidenziato in figura

Nel caso in cui, invece, all’interno del proprio account dovessero già essere presenti dei progetti, creati ad esempio per altri servizi connessi al proprio sito Passweb, è possibile selezionare il progetto desiderato dal relativo elenco e agire su di esso.

• Una volta creato il progetto, o selezionato uno di quelli già presenti all’interno del proprio Account, cliccare sulla voce “Libreria” presente nel menu di navigazione posto sulla sinistra della pagina in maniera tale da accedere alla “Libreria API”

• Selezionare dalla libreria le Api relative ai servizi Firebase di Cloud Messaging (Firebase Cloud Messaging API)

• Abilitare le API cliccando sul relativo pulsante “Abilita”