Configurazione

Prima di aggiungere Accedi con Google, One Tap o Accesso automatico al tuo sito web, configura la configurazione OAuth e, se vuoi, il criterio di sicurezza del contenuto del sito.

Ottenere l'ID client API di Google

Per attivare Accedi con Google sul tuo sito web, devi prima configurare il tuo ID client API di Google. Per farlo, segui questa procedura.

  1. Apri la pagina Credenziali della console API di Google.
  2. Crea o seleziona un progetto API di Google. Se hai già un progetto per il pulsante Accedi con Google o per Google One Tap, utilizza il progetto esistente e l'ID client web. Quando crei applicazioni di produzione, potrebbero essere necessari più progetti. Ripeti i passaggi rimanenti di questa sezione per ogni progetto che gestisci.
  3. Fai clic su Crea credenziali > ID client OAuth e per Tipo di applicazione selezionate Applicazione web per creare un nuovo ID client. Per utilizzare un ID cliente esistente, selezionane uno di tipo Applicazione web.
  4. Aggiungi l'URI del tuo sito web a Origini JavaScript autorizzate. L'URI include solo lo schema e il nome host completo. Ad esempio, https://www.example.com.

  5. Facoltativamente, le credenziali possono essere restituite utilizzando un reindirizzamento a un endpoint ospitato da te anziché tramite un callback JavaScript. In questo caso, aggiungi gli URI di reindirizzamento a URI di reindirizzamento autorizzati. Gli URI di reindirizzamento includono lo schema, il nome host completo e il percorso e devono essere conformi alle regole di convalida dell'URI di reindirizzamento. Ad esempio, https://www.example.com/auth-receiver.

Sia l'autenticazione Accedi con Google sia quella One Tap includono una schermata per il consenso che indica agli utenti l'applicazione che richiede l'accesso ai loro dati, il tipo di dati che vengono richiesti e i termini applicabili.

  1. Apri la pagina Schermata per il consenso OAuth della sezione API e servizi di Google Play Console.
  2. Se richiesto, seleziona il progetto appena creato.
  3. Nella pagina "Schermata del consenso OAuth", compila il modulo e fai clic sul pulsante "Salva".

    1. Nome dell'applicazione:il nome dell'applicazione che richiede il consenso. Il nome deve rispecchiare con precisione la tua applicazione ed essere coerente con il nome dell'applicazione visualizzato dagli utenti altrove.

    2. Logo dell'applicazione:questa immagine viene mostrata nella schermata del consenso per aiutare gli utenti a riconoscere la tua app. Il logo viene mostrato nella schermata del consenso di Accedi con Google e nelle impostazioni dell'account, ma non nella finestra di dialogo One Tap.

    3. Indirizzo email dell'assistenza:visualizzato nella schermata di consenso per l'assistenza utente e agli amministratori di G Suite che valutano l'accesso alla tua applicazione per i propri utenti. Questo indirizzo email viene mostrato agli utenti nella schermata del consenso di Accedi con Google quando l'utente fa clic sul nome dell'applicazione.

    4. Ambiti per le API di Google:gli ambiti consentono alla tua applicazione di accedere ai dati privati dell'utente. Per l'autenticazione, l'ambito predefinito (email, profilo, openid) è sufficiente; non è necessario aggiungere ambiti sensibili. In genere, è buona prassi richiedere gli ambiti in modo incrementale, al momento del bisogno, anziché in anticipo. Scopri di più

    5. Domini autorizzati:per proteggere te e i tuoi utenti, Google consente l'utilizzo dei domini autorizzati solo alle applicazioni che si autenticano tramite OAuth. I link delle tue applicazioni devono essere ospitati su domini autorizzati. Scopri di più.

    6. Link alla home page dell'applicazione:visualizzato nella schermata per il consenso di Accedi con Google e nelle informazioni sul disclaimer conforme al GDPR con un tocco sotto il pulsante "Continua come". Deve essere ospitato su un dominio autorizzato.

    7. Link alle norme sulla privacy dell'applicazione:visualizzato nella schermata per il consenso di Accedi con Google e sulle informazioni sul disclaimer conforme al GDPR con un tocco sotto il pulsante "Continua come". Deve essere ospitato su un dominio autorizzato.

    8. (Facoltativo) Link ai Termini di servizio dell'applicazione: visualizzato nella schermata del consenso per Accedi con Google e nelle informazioni del disclaimer conforme al GDPR con un solo tocco sotto il pulsante "Continua come". Deve essere ospitato su un dominio autorizzato.

  4. Controlla lo "stato di verifica". Se la tua richiesta deve essere verificata, fai clic sul pulsante "Invia per la verifica" per inviare la richiesta per la verifica. Per maggiori dettagli, consulta i requisiti di verifica OAuth.

Visualizzazione delle impostazioni OAuth durante l'accesso

Un tocco con FedCM

Impostazioni per il consenso OAuth visualizzate da Chrome One Tap utilizzando FedCM

Il dominio autorizzato di primo livello viene visualizzato durante il consenso dell'utente in Chrome.

One Tap senza FedCM

Impostazioni consenso OAuth visualizzate da One Tap

Il nome dell'applicazione viene visualizzato durante il consenso dell'utente.

Figura 1. Impostazioni per il consenso OAuth visualizzate da One Tap in Chrome.

Criteri di sicurezza del contenuto

Sebbene facoltativo, è consigliabile utilizzare un Criterio di sicurezza del contenuto per proteggere l'app e prevenire gli attacchi di tipo cross-site scripting (XSS). Per scoprire di più, consulta Introduzione ai CSP e CSP e XSS.

I criteri di sicurezza del contenuto potrebbero includere una o più istruzioni, ad esempio connect-src, frame-src, script-src, style-src o default-src.

Se il tuo fornitore di servizi cloud include:

  • connect-src, aggiungi https://accounts.google.com/gsi/ per consentire a una pagina di caricare l'URL principale per gli endpoint lato server di Google Identity Services.
  • frame-src, aggiungi https://accounts.google.com/gsi/ per consentire l'URL principale degli iframe dei pulsanti One Tap e Accedi con Google.
  • script-src, aggiungi https://accounts.google.com/gsi/client per consentire l'URL della libreria JavaScript di Google Identity Services.
  • style-src, aggiungi https://accounts.google.com/gsi/style per consentire l'URL dei fogli di stile di Google Identity Services.
  • L'istruzione default-src, se utilizzata, è un valore alternativo se una delle direttive precedenti (connect-src, frame-src, script-src o style-src) non è specificata. Aggiungi https://accounts.google.com/gsi/ per consentire a una pagina di caricare l'URL principale per gli endpoint lato server di Google Identity Services.

Evita di elencare singoli URL GIS quando utilizzi connect-src. In questo modo, si riducono al minimo i fallimenti durante l'aggiornamento del GIS. Ad esempio, anziché aggiungere https://accounts.google.com/gsi/status utilizza l'URL principale del GIS https://accounts.google.com/gsi/.

Questo esempio di intestazione di risposta consente a Google Identity Services di caricarsi ed eseguire correttamente:

Content-Security-Policy-Report-Only: script-src
https://accounts.google.com/gsi/client; frame-src
https://accounts.google.com/gsi/; connect-src https://accounts.google.com/gsi/;

Norme di apertura multiorigine

Il pulsante Accedi con Google e Google One Tap potrebbero richiedere modifiche al tuo Cross-Origin-Opener-Policy (COOP) per poter creare popup.

Quando FedCM è attivato, il browser esegue il rendering diretto dei popup e non sono necessarie modifiche.

Tuttavia, quando FedCM è disattivato, imposta l'intestazione COOP:

  • a same-origin e
  • include same-origin-allow-popups.

Se non imposti l'intestazione corretta, la comunicazione tra le finestre viene interrotta, generando una finestra popup vuota o bug simili.