Riferimento all'API HTML Accedi con Google

Questa pagina di riferimento descrive l'API degli attributi dei dati HTML di Accedi con Google. Puoi utilizzare l'API per visualizzare la richiesta One Tap o il pulsante Accedi con Google sulle tue pagine web.

Elemento con ID "g_id_onload"

Puoi inserire gli attributi dei dati di Accedi con Google in qualsiasi elemento visibile o invisibile, come <div> e <span>. L'unico requisito è che l'ID elemento sia impostato su g_id_onload. Non inserire questo ID su più elementi.

Attributi dei dati

Nella tabella seguente sono elencati gli attributi dei dati con le relative descrizioni:

Attributo
data-client_id L'ID client della tua applicazione
data-auto_prompt Mostra Google One Tap.
data-auto_select Consente la selezione automatica su Google One Tap.
data-login_uri L'URL dell'endpoint di accesso
data-callback Il nome della funzione di gestore del token ID JavaScript
data-native_login_uri L'URL dell'endpoint del gestore delle credenziali della password
data-native_callback Il nome della funzione di gestore delle credenziali della password JavaScript
data-native_id_param Il nome del parametro per il valore credential.id
data-native_password_param Il nome del parametro per il valore credential.password
data-cancel_on_tap_outside Consente di stabilire se annullare la richiesta se l'utente fa clic al di fuori della richiesta.
data-prompt_parent_id L'ID DOM dell'elemento contenitore del prompt One Tap
data-skip_prompt_cookie Salta un tocco se il cookie specificato ha un valore non vuoto.
data-nonce Una stringa casuale per i token ID.
data-context Il titolo e le parole nel prompt One Tap
data-moment_callback Il nome della funzione del listener di notifica dello stato dell'interfaccia utente del prompt
data-state_cookie_domain Se devi chiamare One Tap nel dominio principale e nei suoi sottodomini, trasferisci il dominio principale a questo attributo in modo che venga utilizzato un singolo cookie condiviso.
data-ux_mode Flusso UX del pulsante Accedi con Google
data-allowed_parent_origin Le origini autorizzate a incorporare l'iframe intermedio. One Tap viene eseguito in modalità iframe intermedio se è presente questo attributo.
data-intermediate_iframe_close_callback Esegue l'override del comportamento predefinito dell'iframe intermedio quando gli utenti chiudono manualmente One Tap.
data-itp_support Consente di attivare l'UX One Tap aggiornata sui browser ITP.
data-login_hint Salta la selezione dell'account fornendo un suggerimento utente.
data-hd Limita la selezione degli account in base al dominio.
data-use_fedcm_for_prompt Consenti al browser di controllare le richieste di accesso degli utenti e di mediare il flusso di accesso tra il tuo sito web e Google.

Tipi di attributi

Le seguenti sezioni contengono dettagli sul tipo di ogni attributo e un esempio.

ID-client_dati

Questo attributo è l'ID client dell'app, presente e creato nella console Google Cloud. Per saperne di più, consulta la tabella seguente:

Tipo Obbligatorio Esempio
stringa Sì data-client_id="CLIENT_ID.apps.googleusercontent.com"

richiesta-auto-dati

Questo attributo determina se visualizzare o meno un tocco. Il valore predefinito è true. Il tocco Google One non viene visualizzato quando questo valore è false. Per saperne di più, consulta la seguente tabella:

Tipo Obbligatorio Esempio
boolean Facoltativo data-auto_prompt="true"

selezione_automatica-dati

Questo attributo determina se restituire o meno automaticamente un token ID, senza interazione da parte dell'utente, se solo una sessione Google ha approvato la tua app. Il valore predefinito è false. Per saperne di più, consulta la tabella seguente:

Tipo Obbligatorio Esempio
boolean Facoltativo data-auto_select="true"

data-login_uri

Questo attributo è l'URI dell'endpoint di accesso.

Il valore deve corrispondere esattamente a uno degli URI di reindirizzamento autorizzati per il client OAuth 2.0, che hai configurato nella console API e deve essere conforme alle nostre regole di convalida dell'URI di reindirizzamento.

Questo attributo può essere omesso se la pagina corrente è la pagina di accesso, nel qual caso la credenziale viene pubblicata su questa pagina per impostazione predefinita.

La risposta alle credenziali del token ID viene pubblicata nell'endpoint di accesso quando non viene definita alcuna funzione di callback e un utente fa clic sui pulsanti Accedi con Google o One Tap oppure se viene eseguita la firma automatica.

Per saperne di più, consulta la tabella seguente:

Tipo Facoltativo Esempio
URL Il valore predefinito è l'URI della pagina corrente o il valore specificato.
Ignorata quando sono impostati data-ux_mode="popup" e data-callback.		 data-login_uri="https://www.example.com/login"

L'endpoint di accesso deve gestire le richieste POST contenenti una chiave credential con un valore del token ID nel corpo.

Di seguito è riportata una richiesta di esempio all'endpoint di accesso:

POST /login HTTP/1.1
Host: www.example.com
Content-Type: application/x-www-form-urlencoded

credential=ID_TOKEN

callback-dati

Questo attributo è il nome della funzione JavaScript che gestisce il token ID restituito. Per saperne di più, consulta la tabella seguente:

Tipo Obbligatorio Esempio
stringa Obbligatorio se non è impostato data-login_uri. data-callback="handleToken"

Potrebbe essere utilizzato uno degli attributi data-login_uri e data-callback. Dipende dalle seguenti configurazioni dei componenti e della modalità UX:

  • L'attributo data-login_uri è obbligatorio per la modalità UX redirect del pulsante Accedi con Google, che ignora l'attributo data-callback.

  • Uno di questi due attributi deve essere impostato per Google One Tap e per il pulsante Accedi con Google popup modalità UX. Se sono impostati entrambi, l'attributo data-callback ha una precedenza più alta.

Le funzioni JavaScript all'interno di uno spazio dei nomi non sono supportate dall'API HTML. Utilizza invece una funzione JavaScript globale senza uno spazio dei nomi. Ad esempio, utilizza mylibCallback anziché mylib.callback.

data-native_login_uri

Questo attributo è l'URL dell'endpoint del gestore delle credenziali della password. Se imposti l'attributo data-native_login_uri o l'attributo data-native_callback, la libreria JavaScript torna al Gestore delle credenziali nativo quando non esiste una sessione Google. Non hai l'autorizzazione per impostare entrambi gli attributi data-native_callback e data-native_login_uri. Per ulteriori informazioni, consulta la seguente tabella:

Tipo Obbligatorio Esempio
stringa Facoltativo data-login_uri="https://www.example.com/password_login"

callback_nativo_dati

Questo attributo è il nome della funzione JavaScript che gestisce le credenziali della password restituite dal gestore delle credenziali nativo del browser. Se imposti l'attributo data-native_login_uri o l'attributo data-native_callback, la libreria JavaScript torna al Gestore delle credenziali nativo quando non esiste una sessione Google. Non hai l'autorizzazione per impostare data-native_callback e data-native_login_uri. Per ulteriori informazioni, consulta la seguente tabella:

Tipo Obbligatorio Esempio
stringa Facoltativo data-native_callback="handlePasswordCredential"

Le funzioni JavaScript all'interno di uno spazio dei nomi non sono supportate dall'API HTML. Utilizza invece una funzione JavaScript globale senza uno spazio dei nomi. Ad esempio, utilizza mylibCallback anziché mylib.callback.

data-native_id_param

Quando invii la credenziale della password all'endpoint del gestore delle credenziali della password, puoi specificare il nome del parametro per il campo credential.id. Il nome predefinito è email. Per saperne di più, consulta la tabella seguente:

Tipo Obbligatorio Esempio
URL Facoltativo data-native_id_param="user_id"

data-native_password_param

Quando invii la credenziale della password all'endpoint del gestore delle credenziali della password, puoi specificare il nome del parametro per il valore credential.password. Il nome predefinito è password. Per saperne di più, consulta la seguente tabella:

Tipo Obbligatorio Esempio
URL Facoltativo data-native_password_param="pwd"

data-cancel_on_tap_outside

Questo attributo consente di stabilire se annullare o meno la richiesta One Tap se l'utente fa clic al di fuori della richiesta. Il valore predefinito è true. Per disabilitarlo, imposta il valore su false. Per saperne di più, consulta la tabella seguente:

Tipo Obbligatorio Esempio
boolean Facoltativo data-cancel_on_tap_outside="false"

data-prompt_parent_id

Questo attributo imposta l'ID DOM dell'elemento contenitore. Se non è impostata, nell'angolo in alto a destra della finestra viene visualizzata la richiesta One Tap. Per saperne di più, consulta la seguente tabella:

Tipo Obbligatorio Esempio
stringa Facoltativo data-prompt_parent_id="parent_id"

Questo attributo ignora One Tap se il cookie specificato ha un valore non vuoto. Per saperne di più, consulta la seguente tabella:

Tipo Obbligatorio Esempio
stringa Facoltativo data-skip_prompt_cookie="SID"

dati-nonce

Questo attributo è una stringa casuale utilizzata dal token ID per impedire gli attacchi ripetuti. Per saperne di più, consulta la tabella seguente:

Tipo Obbligatorio Esempio
stringa Facoltativo data-nonce="biaqbm70g23"

La lunghezza del nonce è limitata alle dimensioni massime di JWT supportate dal tuo ambiente e ai vincoli delle dimensioni HTTP dei singoli browser e server.

contesto-dati

Questo attributo modifica il testo del titolo e dei messaggi mostrati nella richiesta One Tap. Per saperne di più, consulta la tabella seguente:

Tipo Obbligatorio Esempio
stringa Facoltativo data-context="use"

Nella seguente tabella sono elencati tutti i contesti disponibili e le relative descrizioni:

Il contesto
signin "Accedi con Google"
signup "Registrati con Google"
use "Utilizza con Google"

callback_dati_momento

Questo attributo è il nome della funzione dell'ascoltatore delle notifiche dello stato dell'interfaccia utente del prompt. Per saperne di più, consulta il tipo di dati PromptMomentNotification.

Per saperne di più, consulta la tabella seguente:

Tipo Obbligatorio Esempio
stringa Facoltativo data-moment_callback="logMomentNotification"

Le funzioni JavaScript all'interno di uno spazio dei nomi non sono supportate dall'API HTML. Utilizza invece una funzione JavaScript globale senza uno spazio dei nomi. Ad esempio, utilizza mylibCallback anziché mylib.callback.

Se devi visualizzare One Tap in un dominio principale e nei suoi sottodomini, trasferisci il dominio principale a questo attributo in modo che venga utilizzato un singolo cookie a stato condiviso. Per saperne di più, consulta la tabella seguente:

Tipo Obbligatorio Esempio
stringa Facoltativo data-state_cookie_domain="example.com"

data-ux_mode

Questo attributo imposta il flusso UX utilizzato dal pulsante Accedi con Google. Il valore predefinito è popup. Questo attributo non ha alcun impatto sull'esperienza utente di One Tap. Per saperne di più, consulta la seguente tabella:

Tipo Obbligatorio Esempio
stringa Facoltativo data-ux_mode="redirect"

Nella tabella seguente sono elencate le modalità UX disponibili e le relative descrizioni.

Modalità UX
popup Esegue il flusso UX dell'accesso in una finestra popup.
redirect Esegue il flusso UX dell'accesso mediante un reindirizzamento a una pagina intera.

data-allowed_parent_origin

Le origini autorizzate a incorporare l'iframe intermedio. One Tap viene eseguito in modalità iframe intermedio se questo attributo presenta. Per ulteriori informazioni, consulta la seguente tabella:

Tipo Obbligatorio Esempio
stringa o array di stringhe Facoltativo data-allowed_parent_origin="https://example.com"

Nella tabella seguente sono elencati i tipi di valori supportati e le relative descrizioni.

Tipi di valore
string Un URI di dominio singolo. "https://example.com"
string array Un elenco di URI di dominio separati da virgole. "https://news.example.com,https://local.example.com"

Se il valore dell'attributo data-allowed_parent_origin non è valido, l'inizializzazione One Tap della modalità iframe intermedia non andrà a buon fine e verrà interrotta.

Sono supportati anche i prefissi con caratteri jolly. Ad esempio, "https://*.example.com" trova example.com e i relativi sottodomini a tutti i livelli (ad es.news.example.com, login.news.example.com). Aspetti da tenere presenti quando si utilizzano i caratteri jolly:

  • Le stringhe pattern non possono essere composte solo da un carattere jolly e un dominio di primo livello. Ad esempio, https://*.com e https://*.co.uk non sono validi. Come indicato sopra, "https://*.example.com" corrisponde a example.com e ai relativi sottodomini. Puoi anche utilizzare un elenco separato da virgole per rappresentare due domini diversi. Ad esempio, "https://example1.com,https://*.example2.com" corrisponde ai domini example1.com, example2.com e ai sottodomini di example2.com
  • I domini con caratteri jolly devono iniziare con uno schema https:// sicuro, per cui "*.example.com" non viene considerato valido.

data-intermediate_iframe_close_callback

Sostituisce il comportamento predefinito dell'iframe intermedio quando gli utenti chiudono manualmente One Tap toccando il pulsante "X" nell'interfaccia utente One Tap. Il comportamento predefinito prevede la rimozione immediata dell'iframe intermedio dal DOM.

Il campo data-intermediate_iframe_close_callback ha effetto solo nella modalità iframe intermedio. Inoltre, ha impatto solo sull'iframe intermedio anziché sull'iframe One Tap. L'interfaccia utente One Tap viene rimossa prima della chiamata del callback.

Tipo Obbligatorio Esempio
funzione Facoltativo data-intermediate_iframe_close_callback="logBeforeClose"

Le funzioni JavaScript all'interno di uno spazio dei nomi non sono supportate dall'API HTML. Utilizza invece una funzione JavaScript globale senza uno spazio dei nomi. Ad esempio, utilizza mylibCallback anziché mylib.callback.

assistenza-dati-itp

Questo campo determina se l'esperienza utente One Tap aggiornata deve essere abilitata sui browser che supportano la prevenzione del tracciamento intelligente (ITP). Il valore predefinito è false. Per saperne di più, consulta la seguente tabella:

Tipo Obbligatorio Esempio
boolean Facoltativo data-itp_support="true"

data-login_hint

Se l'applicazione sa in anticipo quale utente deve eseguire l'accesso, può fornire un suggerimento per l'accesso a Google. Se l'operazione va a buon fine, la selezione dell'account viene saltata. I valori accettati sono: un indirizzo email o un campo sotto token ID.

Per ulteriori informazioni, consulta la documentazione di OpenID Connect per login_hint.

Tipo Obbligatorio Esempio
Stringa. Può essere un indirizzo email o il valore del campo sub dal token ID. Facoltativo data-login_hint="elisa.beckett@gmail.com"

data-HD

Se un utente ha più account e deve accedere solo con il proprio account Workspace, usa questo metodo per fornire a Google un suggerimento per il nome di dominio. Se l'operazione va a buon fine, gli account utente visualizzati durante la selezione dell'account sono limitati al dominio fornito. Un valore jolly: * offre solo account Workspace all'utente ed esclude gli account consumer (utente@gmail.com) durante la selezione dell'account.

Per ulteriori informazioni, consulta la documentazione di OpenID Connect per hd.

Tipo Obbligatorio Esempio
Stringa. Un nome di dominio completo o *. Facoltativo data-hd="*"

data-use_fedcm_for_prompt

Consenti al browser di controllare le richieste di accesso degli utenti e di mediare il flusso di accesso tra il tuo sito web e Google. Il valore predefinito è false. Per ulteriori informazioni, consulta la pagina Eseguire la migrazione a FedCM.

Tipo Obbligatorio Esempio
boolean Facoltativo data-use_fedcm_for_prompt="true"

Elemento con classe "g_id_signin"

Se aggiungi g_id_signin all'attributo class di un elemento, l'elemento viene visualizzato come pulsante Accedi con Google.

Puoi visualizzare più pulsanti Accedi con Google sulla stessa pagina. Ogni pulsante può avere le proprie impostazioni visive. Le impostazioni sono definite dai seguenti attributi dei dati.

Attributi dei dati visivi

Nella tabella seguente sono elencati gli attributi visivi dei dati e le relative descrizioni:

Attributo
data-type Tipo di pulsante: icona o pulsante standard.
data-theme Il tema del pulsante. Ad esempio, riempito_blu o riempito_nero.
data-size Le dimensioni del pulsante. ad esempio, piccolo o grande.
data-text Il testo del pulsante. ad esempio "Accedi con Google" o "Registrati con Google".
data-shape La forma del pulsante. Ad esempio, rettangolare o circolare.
data-logo_alignment Allineamento del logo di Google: a sinistra o al centro.
data-width La larghezza del pulsante, in pixel.
data-locale Il testo del pulsante viene visualizzato nella lingua impostata in questo attributo.
data-click_listener Se impostata, questa funzione viene richiamata quando si fa clic sul pulsante Accedi con Google.
data-state Se impostata, questa stringa restituisce il token ID.

Tipi di attributi

Le seguenti sezioni contengono dettagli sul tipo di ogni attributo e un esempio.

tipo di dati

Il tipo di pulsante. Il valore predefinito è standard. Per ulteriori informazioni, consulta la seguente tabella:

Tipo Obbligatorio Esempio
stringa Sì data-type="icon"

Nella seguente tabella sono elencati tutti i tipi di pulsanti disponibili e le relative descrizioni:

Tipo
standard
Un pulsante con testo o informazioni personalizzate.
icon
Un pulsante icona senza testo.

tema-dati

Il tema del pulsante. Il valore predefinito è outline. Per ulteriori informazioni, consulta la seguente tabella:

Tipo Obbligatorio Esempio
stringa Facoltativo data-theme="filled_blue"

Nella tabella seguente sono elencati i temi disponibili e le relative descrizioni:

Tema
outline
Un pulsante standard con uno sfondo bianco Un pulsante icona con uno sfondo bianco Un pulsante personalizzato con uno sfondo bianco
Il tema standard dei pulsanti.
filled_blue
Un pulsante standard con uno sfondo blu Un pulsante icona con uno sfondo blu Un pulsante personalizzato con uno sfondo blu
Il tema dei pulsanti con riempimento blu.
filled_black
Un pulsante standard con uno sfondo nero Un pulsante icona con uno sfondo nero Un pulsante personalizzato con uno sfondo nero
Il tema dei pulsanti con riempimento nero.

data-size

Le dimensioni del pulsante. Il valore predefinito è large. Per ulteriori informazioni, consulta la seguente tabella:

Tipo Obbligatorio Esempio
stringa Facoltativo data-size="small"

Nella tabella seguente sono elencate le dimensioni dei pulsanti disponibili e le relative descrizioni.

Dimensioni
large
Un pulsante standard grande Un pulsante icona grande Un pulsante grande personalizzato
Un pulsante di grandi dimensioni.
medium
Un pulsante standard di medie dimensioni Pulsante con un&#39;icona di medie dimensioni
Un pulsante di dimensioni medie.
small
Un pulsante piccolo Un piccolo pulsante icona
Un piccolo pulsante.

testo-dati

Il testo del pulsante. Il valore predefinito è signin_with. Non ci sono differenze visive per il testo dei pulsanti delle icone con attributi data-text diversi. L'unica eccezione è quando il testo viene letto ai fini dell'accessibilità dello schermo.

Per saperne di più, consulta la tabella seguente:

Tipo Obbligatorio Esempio
stringa Facoltativo data-text="signup_with"

Nella tabella seguente sono elencati i testi dei pulsanti disponibili e le relative descrizioni:

Testo
signin_with
Un pulsante standard con l&#39;etichetta &quot;Accedi con Google&quot; Un pulsante a forma di icona senza testo visibile
Il testo del pulsante è "Accedi con Google".
signup_with
Un pulsante standard con l&#39;etichetta &quot;Registrati con Google&quot; Un pulsante a forma di icona senza testo visibile
Il testo del pulsante è "Registrati con Google".
continue_with
Un pulsante standard con l&#39;etichetta &quot;Continua con Google&quot; Un pulsante a forma di icona senza testo visibile
Il testo del pulsante è "Continua con Google".
signin
Un pulsante standard con l&#39;etichetta &quot;Accedi&quot; Un pulsante a forma di icona senza testo visibile
Il testo del pulsante è "Accedi".

forma dei dati

La forma del pulsante. Il valore predefinito è rectangular. Per saperne di più, consulta la seguente tabella:

Tipo Obbligatorio Esempio
stringa Facoltativo data-shape="rectangular"

Nella tabella seguente sono elencate le forme dei pulsanti disponibili e le relative descrizioni:

Shape
rectangular
Un pulsante standard rettangolare Un pulsante con un&#39;icona rettangolare Un pulsante rettangolare personalizzato
Il pulsante di forma rettangolare. Se utilizzato per il tipo di pulsante icon, è uguale a square.
pill
Un pulsante standard a forma di pillola Pulsante icona a forma di pillola Un pulsante personalizzato a forma di pillola
Il pulsante a forma di pillola. Se utilizzato per il tipo di pulsante icon, è uguale a circle.
circle
Un pulsante standard circolare Un pulsante con un&#39;icona circolare Un pulsante rotondo personalizzato
Il pulsante a forma di cerchio. Se utilizzato per il tipo di pulsante standard, è uguale a pill.
square
Un pulsante quadrato standard Pulsante quadrato con un&#39;icona Un pulsante quadrato personalizzato
Il pulsante di forma quadrata. Se utilizzato per il tipo di pulsante standard, è uguale a rectangular.

allineamento-logo_dati

L'allineamento del logo di Google. Il valore predefinito è left. Questo attributo si applica solo al tipo di pulsante standard. Per saperne di più, consulta la seguente tabella:

Tipo Obbligatorio Esempio
stringa Facoltativo data-logo_alignment="center"

Nella tabella seguente sono elencati gli allineamenti disponibili e le relative descrizioni:

logo_alignment
left
Un pulsante standard con il logo G a sinistra
Consente di allineare a sinistra il logo di Google.
center
Un pulsante standard con il logo G al centro
Allinea al centro il logo Google.

larghezza dati

La larghezza minima del pulsante, in pixel. La larghezza massima disponibile è 400 pixel.

Per saperne di più, consulta la tabella seguente:

Tipo Obbligatorio Esempio
stringa Facoltativo data-width=400

data-locale

Campo facoltativo. Mostra il testo del pulsante utilizzando le impostazioni internazionali specificate, altrimenti mostra come valore predefinito l'Account Google dell'utente o le impostazioni del browser. Aggiungi il parametro hl e il codice lingua all'istruzione src durante il caricamento della libreria, ad esempio: gsi/client?hl=<iso-639-code>.

Se non sono configurate, vengono utilizzate le impostazioni internazionali predefinite del browser o la preferenza dell'utente della sessione Google. Pertanto, utenti diversi potrebbero visualizzare versioni diverse dei pulsanti localizzati, anche di dimensioni diverse.

Per saperne di più, consulta la tabella seguente:

Tipo Obbligatorio Esempio
stringa Facoltativo data-locale="zh_CN"

data-click_listener

Puoi definire una funzione JavaScript da chiamare quando viene fatto clic sul pulsante Accedi con Google utilizzando l'attributo data-click_listener.

  <script>
    function onClickHandler(){
      console.log("Sign in with Google button clicked...")
    }
  </script>
  .....
  <div class="g_id_signin"
      data-size="large"
      data-theme="outline"
      data-click_listener="onClickHandler">
  </div>

In questo esempio, il messaggio Accedi con Google selezionato... viene registrato nella console quando viene fatto clic sul pulsante Accedi con Google.

data-state

Facoltativo, poiché sulla stessa pagina è possibile visualizzare più pulsanti Accedi con Google, puoi assegnare a ogni pulsante una stringa univoca. La stessa stringa verrebbe restituita insieme al token ID, quindi puoi identificare il pulsante su cui l'utente ha fatto clic per accedere.

Per saperne di più, consulta la tabella seguente:

Tipo Obbligatorio Esempio
stringa Facoltativo data-state="button 1"

Integrazione lato server

I tuoi endpoint lato server devono gestire le seguenti richieste HTTP POST.

L'endpoint del gestore di token ID

L'endpoint del gestore del token ID elabora il token ID. In base allo stato dell'account corrispondente, puoi eseguire l'accesso all'utente e indirizzarlo a una pagina di registrazione o a una pagina di collegamento dell'account per ulteriori informazioni.

La richiesta HTTP POST contiene le seguenti informazioni:

Formato Nome Descrizione
Cookie g_csrf_token Una stringa casuale che cambia a ogni richiesta all'endpoint del gestore.
Parametro di richiesta g_csrf_token Una stringa uguale al valore del cookie precedente, g_csrf_token.
Parametro di richiesta credential Il token ID emesso da Google.
Parametro di richiesta select_by Modalità di selezione della credenziale.
Parametro di richiesta state Questo parametro viene definito solo quando l'utente fa clic su un pulsante Accedi con Google per accedere e viene specificato l'attributo state del pulsante.

credenziale

Quando è decodificato, il token ID è simile al seguente esempio:

header
{
  "alg": "RS256",
  "kid": "f05415b13acb9590f70df862765c655f5a7a019e", // JWT signature
  "typ": "JWT"
}
payload
{
  "iss": "https://accounts.google.com", // The JWT's issuer
  "nbf":  161803398874,
  "aud": "314159265-pi.apps.googleusercontent.com", // Your server's client ID
  "sub": "3141592653589793238", // The unique ID of the user's Google Account
  "hd": "gmail.com", // If present, the host domain of the user's GSuite email address
  "email": "elisa.g.beckett@gmail.com", // The user's email address
  "email_verified": true, // true, if Google has verified the email address
  "azp": "314159265-pi.apps.googleusercontent.com",
  "name": "Elisa Beckett",
                            // If present, a URL to user's profile picture
  "picture": "https://lh3.googleusercontent.com/a-/e2718281828459045235360uler",
  "given_name": "Eliza",
  "family_name": "Beckett",
  "iat": 1596474000, // Unix timestamp of the assertion's creation time
  "exp": 1596477600, // Unix timestamp of the assertion's expiration time
  "jti": "abc161803398874def"
}

Il campo sub è un identificatore univoco globale per l'Account Google. Utilizza solo il campo sub come identificatore dell'utente, in quanto è univoco tra tutti gli Account Google e non è mai riutilizzato. Non utilizzare l'indirizzo email come identificatore perché un Account Google può avere più indirizzi email in diversi momenti.

Utilizzando i campi email, email_verified e hd, puoi determinare se Google ospita ed è autorevole per un indirizzo email. Nei casi in cui Google è autorevole, è stato confermato che l'utente è il legittimo proprietario dell'account.

Casi in cui Google è autorevole:

  • email ha un suffisso @gmail.com, quindi questo è un account Gmail.
  • email_verified è true e hd è impostato, questo è un account Google Workspace.

Gli utenti possono registrarsi ad Account Google senza utilizzare Gmail o Google Workspace. Quando email non contiene un suffisso @gmail.com e hd non è presente, Google non è autorevole e si consiglia di verificare l'utente con metodi di verifica della password o di altri metodi di verifica. Il valore email_verified può essere vero anche perché Google ha inizialmente verificato l'utente al momento della creazione dell'Account Google, ma la proprietà dell'account email di terze parti potrebbe essere cambiata da allora.

Il campo exp mostra la data e l'ora di scadenza necessarie per verificare il token sul lato server. Manca un'ora per il token ID ottenuto da Accedi con Google. Devi verificare il token prima della scadenza. Non utilizzare exp per la gestione delle sessioni. Un token ID scaduto non indica che l'utente è disconnesso. La tua app è responsabile della gestione delle sessioni degli utenti.

select_by

Nella tabella seguente sono elencati i possibili valori per il campo select_by. Il tipo di pulsante usato insieme allo stato della sessione e del consenso vengono usati per impostare il valore,

  • L'utente ha premuto il pulsante One Tap o Accedi con Google oppure ha utilizzato la procedura di accesso automatico touchless.

  • È stata trovata una sessione esistente o l'utente ha selezionato e eseguito l'accesso a un Account Google per stabilire una nuova sessione.

  • Prima di condividere le credenziali del token ID con la tua app, l'utente

    • hanno premuto il pulsante Conferma per concedere il consenso a condividere le credenziali,
    • aveva precedentemente concesso il consenso e usato Seleziona un account per scegliere un Account Google.

Il valore di questo campo è impostato su uno di questi tipi,

Valore Descrizione
auto Accesso automatico di un utente con una sessione esistente che in precedenza aveva concesso il consenso alla condivisione delle credenziali. Si applica solo ai browser non supportati da FedCM.
user Un utente in una sessione esistente che aveva precedentemente concesso il consenso ha premuto il pulsante "Continua come" One Tap per condividere le credenziali. Si applica solo ai browser non supportati da FedCM.
fedcm Un utente ha premuto il pulsante One Tap "Continua come" per condividere le credenziali tramite FedCM. Si applica solo ai browser supportati FedCM.
fedcm_auto Accesso automatico di un utente con una sessione esistente che in precedenza aveva concesso il consenso a condividere le credenziali tramite FedCM One Tap. Si applica solo ai browser supportati FedCM.
user_1tap Un utente con una sessione esistente ha premuto il pulsante "Continua come" One Tap per concedere il consenso e condividere le credenziali. Si applica solo a Chrome v75 e versioni successive.
user_2tap Un utente senza una sessione esistente ha premuto il pulsante "Continua come" One Tap per selezionare un account, quindi ha premuto il pulsante Conferma in una finestra popup per concedere il consenso e condividere le credenziali. Si applica ai browser non basati su Chromium.
btn Un utente di una sessione esistente che in precedenza aveva concesso il consenso ha premuto il pulsante Accedi con Google e ha selezionato un Account Google da "Scegli un account" per condividere le credenziali.
btn_confirm Un utente con una sessione esistente ha premuto il pulsante Accedi con Google e il pulsante Conferma per concedere il consenso e condividere le credenziali.
btn_add_session Un utente senza una sessione esistente che aveva precedentemente concesso il consenso ha premuto il pulsante Accedi con Google per selezionare un Account Google e condividere le credenziali.
btn_confirm_add_session Un utente senza una sessione esistente ha prima premuto il pulsante Accedi con Google per selezionare un Account Google, quindi il pulsante Conferma per dare il consenso e condividere le credenziali.

state

Questo parametro viene definito solo quando l'utente fa clic su un pulsante Accedi con Google per eseguire l'accesso e viene specificato l'attributo data-state del pulsante selezionato. Il valore di questo campo è lo stesso specificato nell'attributo data-state del pulsante.

Poiché sulla stessa pagina è possibile visualizzare più pulsanti Accedi con Google, puoi assegnare a ogni pulsante una stringa univoca. Di conseguenza, puoi utilizzare il parametro state per identificare il pulsante che l'utente ha fatto clic per accedere.

Endpoint del gestore delle credenziali password

L'endpoint del gestore delle credenziali della password elabora le credenziali delle password recuperate dal Gestore delle credenziali nativo.

La richiesta HTTP POST contiene le seguenti informazioni:

Formato Nome Descrizione
Cookie g_csrf_token Una stringa casuale che cambia a ogni richiesta all'endpoint del gestore.
Parametro di richiesta g_csrf_token Una stringa uguale al valore del cookie precedente, g_csrf_token.
Parametro di richiesta email Token ID emesso da Google.
Parametro di richiesta password Modalità di selezione della credenziale.