Referencia de la API de HTML de Acceder con Google

En esta página de referencia, se describe la API de atributos de datos HTML de Acceder con Google. Puedes usar la API para mostrar el mensaje de One Tap o el botón de Acceder con Google en tus páginas web.

Elemento con el ID "g_id_onload"

Puedes colocar los atributos de datos de Acceder con Google en cualquier elemento visible o invisible, como <div> y <span>. El único requisito es que el ID del elemento esté configurado en g_id_onload. No coloques este ID en varios elementos.

Atributos de datos

En la siguiente tabla, se indican los atributos de datos con sus descripciones:

Atributo
data-client_id El ID de cliente de tu aplicación
data-auto_prompt Muestra el toque de Google One.
data-auto_select Habilita la selección automática en Google One Tap.
data-login_uri La URL del extremo de acceso
data-callback El nombre de la función del controlador de tokens de ID de JavaScript
data-native_login_uri La URL del extremo del controlador de credenciales de contraseña
data-native_callback Nombre de la función del controlador de credenciales de contraseña de JavaScript
data-native_id_param El nombre del parámetro para el valor credential.id
data-native_password_param El nombre del parámetro para el valor credential.password
data-cancel_on_tap_outside Controla si se cancela el mensaje si el usuario hace clic fuera de este.
data-prompt_parent_id El ID del DOM del elemento del contenedor del mensaje de One Tap
data-skip_prompt_cookie Omite One Tap si la cookie especificada tiene un valor que no está vacío.
data-nonce Una cadena aleatoria para tokens de ID
data-context El título y las palabras en el mensaje de One Tap
data-moment_callback El nombre de la función del objeto de escucha de notificaciones de estado de la IU de instrucciones
data-state_cookie_domain Si necesitas llamar a One Tap en el dominio superior y sus subdominios, pasa el dominio superior a este atributo para que se use una sola cookie compartida.
data-ux_mode El flujo de UX del botón de Acceder con Google
data-allowed_parent_origin Los orígenes autorizados para incorporar el iframe intermedio. One Tap se ejecuta en el modo intermedio de iframe si está presente este atributo.
data-intermediate_iframe_close_callback Anula el comportamiento predeterminado del iframe intermedio cuando los usuarios cierran One Tap de forma manual.
data-itp_support Habilita la UX actualizada de One Tap en navegadores ITP.
data-login_hint Para omitir la selección de cuenta, proporciona una sugerencia para el usuario.
data-hd Limita la selección de cuentas por dominio.
data-use_fedcm_for_prompt Permite que el navegador controle los mensajes de acceso de los usuarios y media el flujo de acceso entre tu sitio web y Google.

Tipos de atributos

Las siguientes secciones contienen detalles sobre el tipo de atributo y un ejemplo.

datos-cliente_id

Este atributo es el ID de cliente de tu app, que se encuentra y crea en la consola de Google Cloud. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Sí data-client_id="CLIENT_ID.apps.googleusercontent.com"

mensaje_automático_datos

Este atributo determina si se muestra One Tap o no. El valor predeterminado es true. No se muestra el toque de Google One cuando este valor es false. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
boolean Opcional data-auto_prompt="true"

selección_automática de datos

Este atributo determina si se muestra o no un token de ID de forma automática, sin ninguna interacción del usuario, si solo una sesión de Google aprobó tu app. El valor predeterminado es false. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
boolean Opcional data-auto_select="true"

data-login_uri

Este atributo es el URI de tu extremo de acceso.

El valor debe coincidir exactamente con uno de los URI de redireccionamiento autorizados para el cliente de OAuth 2.0, que configuraste en la Consola de APIs y debe cumplir con nuestras reglas de validación de URI de redireccionamiento.

Este atributo se puede omitir si la página actual es tu página de acceso, en cuyo caso la credencial se publicará en esta página de forma predeterminada.

La respuesta de la credencial del token de ID se publica en tu extremo de acceso cuando no se define ninguna función de devolución de llamada y un usuario hace clic en los botones Acceder con Google o One Tap, o cuando se realiza la señal automática.

Consulta la siguiente tabla para obtener más información:

Tipo Opcional Ejemplo
URL La configuración predeterminada es el URI de la página actual o el valor que especifiques.
Se ignora cuando se configuran data-ux_mode="popup" y data-callback.		 data-login_uri="https://www.example.com/login"

El extremo de acceso debe controlar las solicitudes POST que contengan una clave credential con un valor de token de ID en el cuerpo.

A continuación, se muestra un ejemplo de solicitud a tu extremo de acceso:

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

credential=ID_TOKEN

data-callback

Este atributo es el nombre de la función de JavaScript que controla el token de ID que se muestra. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Es obligatorio si no se configura data-login_uri. data-callback="handleToken"

Es posible que se use uno de los atributos data-login_uri y data-callback. Depende de las siguientes configuraciones de componentes y modo de UX:

  • El atributo data-login_uri es obligatorio para el modo de UX del botón de Acceder con Google redirect, que ignora el atributo data-callback.

  • Se debe configurar uno de estos dos atributos para Google One Tap y el modo de UX del botón de Acceso con Google popup. Si se configuran ambos, el atributo data-callback tiene mayor precedencia.

La API de HTML no admite las funciones de JavaScript dentro de un espacio de nombres. En su lugar, usa una función global de JavaScript sin un espacio de nombres. Por ejemplo, usa mylibCallback en lugar de mylib.callback.

data-native_login_uri

Este atributo es la URL del extremo del controlador de credenciales de contraseña. Si configuras los atributos data-native_login_uri o data-native_callback, la biblioteca JavaScript recurre al administrador de credenciales nativo cuando no hay una sesión de Google. No puedes configurar los atributos data-native_callback y data-native_login_uri al mismo tiempo. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Opcional data-login_uri="https://www.example.com/password_login"

devolución_de_llamada_nativa_de_datos

Este atributo es el nombre de la función de JavaScript que maneja la credencial de contraseña que muestra el administrador de credenciales nativo del navegador. Si configuras los atributos data-native_login_uri o data-native_callback, la biblioteca JavaScript recurre al administrador de credenciales nativo cuando no hay una sesión de Google. No puedes configurar data-native_callback y data-native_login_uri al mismo tiempo. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Opcional data-native_callback="handlePasswordCredential"

La API de HTML no admite las funciones de JavaScript dentro de un espacio de nombres. En su lugar, usa una función global de JavaScript sin un espacio de nombres. Por ejemplo, usa mylibCallback en lugar de mylib.callback.

data-native_id_param

Cuando envías la credencial de contraseña al extremo del controlador de credenciales de contraseña, puedes especificar el nombre del parámetro para el campo credential.id. El nombre predeterminado es email. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
URL Opcional data-native_id_param="user_id"

data-native_password_param

Cuando envías la credencial de contraseña al extremo del controlador de credenciales de contraseña, puedes especificar el nombre del parámetro para el valor credential.password. El nombre predeterminado es password. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
URL Opcional data-native_password_param="pwd"

data-cancel_on_tap_outside

Este atributo establece si se cancela o no la solicitud de One Tap si el usuario hace clic fuera del mensaje. El valor predeterminado es true. Para inhabilitarla, establece el valor en false. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
boolean Opcional data-cancel_on_tap_outside="false"

data-prompt_parent_id

Este atributo establece el ID del DOM del elemento del contenedor. Si no lo está, se mostrará el mensaje de One Tap en la esquina superior derecha de la ventana. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Opcional data-prompt_parent_id="parent_id"

Este atributo omite One Tap si la cookie especificada tiene un valor que no está vacío. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Opcional data-skip_prompt_cookie="SID"

nonce de datos

Este atributo es una string aleatoria que utiliza el token de ID para evitar ataques de repetición. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Opcional data-nonce="biaqbm70g23"

La longitud del nonce se limita al tamaño máximo de JWT compatible con tu entorno y las restricciones de tamaño individual del navegador y del servidor.

contexto de datos

Este atributo cambia el texto del título y los mensajes que se muestran en el mensaje de One Tap. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Opcional data-context="use"

En la siguiente tabla, se enumeran todos los contextos disponibles y sus descripciones:

La importancia
signin "Acceder con Google"
signup "Regístrate con Google"
use "Usar con Google"

devolución de llamada de momento de datos

Este atributo es el nombre de la función del objeto de escucha de notificaciones de estado de la IU del mensaje. Para obtener más información, consulta el tipo de datos PromptMomentNotification.

Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Opcional data-moment_callback="logMomentNotification"

La API de HTML no admite las funciones de JavaScript dentro de un espacio de nombres. En su lugar, usa una función global de JavaScript sin un espacio de nombres. Por ejemplo, usa mylibCallback en lugar de mylib.callback.

Si necesitas mostrar One Tap en un dominio superior y sus subdominios, pasa el dominio superior a este atributo para que se use una sola cookie de estado compartido. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Opcional data-state_cookie_domain="example.com"

data-ux_mode

Este atributo establece el flujo de UX que utiliza el botón Acceder con Google. El valor predeterminado es popup. Este atributo no afecta la UX de One Tap. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Opcional data-ux_mode="redirect"

En la siguiente tabla, se enumeran los modos de UX disponibles y sus descripciones.

Modo UX
popup Realiza el flujo de UX de acceso en una ventana emergente.
redirect Realiza el flujo de UX de acceso a través de un redireccionamiento de página completa.

data-allowed_parent_origin

Los orígenes autorizados para incorporar el iframe intermedio. One Tap se ejecuta en el modo intermedio de iframe si se presenta este atributo. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena o array de cadenas Opcional data-allowed_parent_origin="https://example.com"

En la siguiente tabla, se enumeran los tipos de valores admitidos y sus descripciones.

Tipos de valores
string Un URI de dominio único. “https://example.com”
string array Una lista de URI de dominio separados por comas. "https://news.example.com,https://local.example.com"

Si el valor del atributo data-allowed_parent_origin no es válido, la inicialización con One Tap del modo intermedio de iframe fallará y se detendrá.

También se admiten prefijos comodín. Por ejemplo, "https://*.example.com" coincide con example.com y sus subdominios en todos los niveles (p. ej., news.example.com y login.news.example.com). Ten en cuenta lo siguiente cuando uses comodines:

  • Las cadenas de patrón no pueden estar compuestas solo por un comodín y un dominio de nivel superior. Por ejemplo, https://*.com y https://*.co.uk no son válidos. Como se indicó antes, "https://*.example.com" coincide con example.com y sus subdominios. También puedes usar una lista separada por comas para representar 2 dominios diferentes. Por ejemplo, "https://example1.com,https://*.example2.com" coincide con los dominios example1.com, example2.com y los subdominios de example2.com.
  • Los dominios comodín deben comenzar con un esquema https:// seguro, por lo que "*.example.com" se considera no válido.

data-intermediate_iframe_close_callback

Anula el comportamiento predeterminado del iframe intermedio cuando los usuarios cierran manualmente One Tap. Para ello, presionan el botón "X" en la IU de One Tap. El comportamiento predeterminado consiste en quitar de inmediato el iframe intermedio del DOM.

El campo data-intermediate_iframe_close_callback solo se aplica en el modo intermedio de iframe. Y solo tiene impacto en el iframe intermedio, en lugar del iframe de One Tap. La IU de One Tap se quita antes de invocar la devolución de llamada.

Tipo Obligatorio Ejemplo
la función Opcional data-intermediate_iframe_close_callback="logBeforeClose"

La API de HTML no admite las funciones de JavaScript dentro de un espacio de nombres. En su lugar, usa una función global de JavaScript sin un espacio de nombres. Por ejemplo, usa mylibCallback en lugar de mylib.callback.

compatibilidad_datos-itp

Este campo determina si se debe habilitar la UX actualizada de One Tap en los navegadores compatibles con la Prevención de seguimiento inteligente (ITP). El valor predeterminado es false. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
boolean Opcional data-itp_support="true"

data-login_hint

Si tu aplicación sabe de antemano qué usuario debe acceder, puede proporcionar una sugerencia de acceso a Google. Si se realiza correctamente, se omitirá la selección de cuenta. Los valores aceptados son los siguientes: una dirección de correo electrónico o un campo sub del token de ID.

Para obtener más información, consulta la documentación de OpenID Connect para login_hint.

Tipo Obligatorio Ejemplo
String. Puede ser una dirección de correo electrónico o el valor del campo sub del token de ID. Opcional data-login_hint="elisa.beckett@gmail.com"

datos en HD

Cuando un usuario tiene varias cuentas y solo debe acceder con su cuenta de Workspace, usa esto para proporcionarle a Google una sugerencia de nombre de dominio. Si se ejecuta de forma correcta, las cuentas de usuario que se muestran durante la selección de cuentas se limitan al dominio proporcionado. Un valor comodín: * solo ofrece al usuario cuentas de Workspace y excluye las cuentas personales (user@gmail.com) durante la selección de la cuenta.

Para obtener más información, consulta la documentación de OpenID Connect para hd.

Tipo Obligatorio Ejemplo
String. Un nombre de dominio completamente calificado o *. Opcional data-hd="*"

data-use_fedcm_for_prompt

Permite que el navegador controle los mensajes de acceso de los usuarios y media el flujo de acceso entre tu sitio web y Google. La configuración predeterminada es "false". Consulta la página Migra al FedCM para obtener más información.

Tipo Obligatorio Ejemplo
boolean Opcional data-use_fedcm_for_prompt="true"

Elemento con la clase "g_id_signin"

Si agregas g_id_signin al atributo class de un elemento, este se renderiza como un botón de Acceder con Google.

Puedes renderizar varios botones de Acceder con Google en la misma página. Cada botón puede tener su propia configuración visual. La configuración se define según los siguientes atributos de datos.

Atributos de datos visuales

En la siguiente tabla, se enumeran los atributos de datos visuales y sus descripciones:

Atributo
data-type El tipo de botón: ícono o botón estándar.
data-theme El tema del botón Por ejemplo, relleno_azul o negro_relleno.
data-size El tamaño del botón. Por ejemplo, pequeño o grande.
data-text El texto del botón. Por ejemplo, "Acceder con Google" o "Registrarse con Google".
data-shape Forma del botón Por ejemplo, rectangular o circular.
data-logo_alignment Alineación del logotipo de Google: izquierda o centro
data-width Es el ancho del botón en píxeles.
data-locale El texto del botón se renderiza en el idioma configurado en este atributo.
data-click_listener Si se configura, se llama a esta función cuando se hace clic en el botón Acceder con Google.
data-state Si se configura, esta cadena se muestra con el token de ID.

Tipos de atributos

Las siguientes secciones contienen detalles sobre el tipo de atributo y un ejemplo.

tipo de datos

El tipo de botón. El valor predeterminado es standard. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Sí data-type="icon"

En la siguiente tabla, se enumeran todos los tipos de botones disponibles y sus descripciones:

Tipo
standard
Un botón con texto o información personalizada.
icon
Un botón de ícono sin texto.

data-theme

El tema del botón El valor predeterminado es outline. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Opcional data-theme="filled_blue"

En la siguiente tabla, se indican los temas disponibles y sus descripciones:

Tema
outline
Un botón estándar con un fondo blanco Un botón de ícono con un fondo blanco Un botón personalizado con un fondo blanco
El tema del botón estándar.
filled_blue
Un botón estándar con un fondo azul Un botón de ícono con un fondo azul Un botón personalizado con un fondo azul
El tema del botón relleno de color azul.
filled_black
Un botón estándar con un fondo negro Un botón de ícono con un fondo negro Un botón personalizado con un fondo negro
El tema del botón lleno de negro.

data-size

El tamaño del botón. El valor predeterminado es large. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Opcional data-size="small"

En la siguiente tabla, se indican los tamaños de botones disponibles y sus descripciones.

del vocab.
large
Un botón estándar grande Un botón de ícono grande Un botón grande y personalizado
Un botón grande.
medium
Un botón estándar mediano Un botón de ícono mediano
Un botón de tamaño mediano
small
Un botón pequeño Un botón de ícono pequeño
Un botón pequeño.

texto-datos

El texto del botón. El valor predeterminado es signin_with. No hay diferencias visuales para el texto de los botones de íconos que tienen diferentes atributos data-text. La única excepción es cuando el texto se lee para la accesibilidad de la pantalla.

Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Opcional data-text="signup_with"

En la siguiente tabla, se indican los textos de botones disponibles y sus descripciones:

Texto
signin_with
Un botón estándar con la etiqueta &quot;Acceder con Google&quot; Un botón de ícono sin texto visible
El texto del botón es "Acceder con Google".
signup_with
Un botón estándar con la etiqueta &quot;Registrarse con Google&quot; Un botón de ícono sin texto visible
El texto del botón es “Registrarse con Google”.
continue_with
Un botón estándar con la etiqueta &quot;Continuar con Google&quot; Un botón de ícono sin texto visible
El texto del botón es "Continuar con Google".
signin
Un botón estándar con la etiqueta &quot;Acceder&quot; Un botón de ícono sin texto visible
El texto del botón es "Acceder".

forma de datos

Forma del botón El valor predeterminado es rectangular. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Opcional data-shape="rectangular"

En la siguiente tabla, se enumeran las formas de botones disponibles y sus descripciones:

Forma
rectangular
Un botón estándar rectangular Un botón de ícono rectangular Un botón rectangular personalizado
El botón con forma rectangular. Si se usa para el tipo de botón icon, es lo mismo que square.
pill
Un botón estándar en forma de píldora Un botón de ícono con forma de píldora Un botón personalizado con forma de píldora
El botón con forma de píldora Si se usa para el tipo de botón icon, es lo mismo que circle.
circle
Un botón estándar circular Un botón de ícono circular Un botón circular personalizado
El botón en forma de círculo. Si se usa para el tipo de botón standard, es lo mismo que pill.
square
Un botón estándar cuadrado Un botón de ícono cuadrado Un botón cuadrado personalizado
El botón cuadrado Si se usa para el tipo de botón standard, es lo mismo que rectangular.

alineación_logotipo_datos

La alineación del logotipo de Google El valor predeterminado es left. Este atributo solo se aplica al tipo de botón standard. Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Opcional data-logo_alignment="center"

En la siguiente tabla, se enumeran las alineaciones disponibles y sus descripciones:

logo_alignment
left
Un botón estándar con el logotipo de la G a la izquierda
Alinea a la izquierda el logotipo de Google.
center
Un botón estándar con el logotipo de la G en el centro
Alinea al centro el logotipo de Google.

ancho de datos

El ancho mínimo del botón en píxeles. El ancho máximo disponible es de 400 píxeles.

Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Opcional data-width=400

configuración regional de los datos

Opcional. Muestra el texto del botón con la configuración regional especificada; de lo contrario, se mostrará la Cuenta de Google del usuario o la configuración del navegador de manera predeterminada. Agrega el parámetro hl y el código de idioma a la directiva src cuando cargues la biblioteca, por ejemplo: gsi/client?hl=<iso-639-code>.

Si no está configurado, se utiliza la configuración regional predeterminada del navegador o la preferencia del usuario de la sesión de Google. Por lo tanto, es posible que diferentes usuarios vean versiones diferentes de los botones localizados y, posiblemente, con diferentes tamaños.

Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Opcional data-locale="zh_CN"

objeto de escucha_clic_datos

Puedes definir una función de JavaScript a la que se llamará cuando se haga clic en el botón Acceder con Google mediante el atributo 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>

En este ejemplo, el mensaje Se hizo clic en el botón Acceder con Google... se registra en la consola cuando se hace clic en el botón Acceder con Google.

data-state

Opcional, ya que se pueden renderizar varios botones de Acceder con Google en la misma página, puedes asignar una cadena única a cada uno. Se mostrará la misma cadena junto con el token de ID, de modo que puedas identificar en qué botón el usuario hizo clic para acceder.

Consulta la siguiente tabla para obtener más información:

Tipo Obligatorio Ejemplo
cadena Opcional data-state="button 1"

Integración del servidor

Los extremos del servidor deben controlar las siguientes solicitudes POST HTTP.

El extremo del controlador de tokens de ID

El extremo del controlador de tokens de ID procesa el token de ID. Según el estado de la cuenta correspondiente, puedes hacer que el usuario acceda y dirigirlo a una página de registro o dirigirlo a una página de vinculación de cuentas para obtener información adicional.

La solicitud HTTP POST contiene la siguiente información:

Formato Nombre Descripción
Cookie g_csrf_token Una string aleatoria que cambia con cada solicitud al extremo del controlador.
Parámetro de solicitud g_csrf_token Una cadena que es igual al valor de la cookie anterior, g_csrf_token.
Parámetro de solicitud credential El token de ID que emite Google.
Parámetro de solicitud select_by Cómo se selecciona la credencial
Parámetro de solicitud state Este parámetro solo se define cuando el usuario hace clic en un botón de Acceder con Google para ingresar y se especifica el atributo state del botón.

credencial

Cuando se decodifica, el token de ID se ve como el siguiente ejemplo: 

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"
}

El campo sub es un identificador único a nivel global de la Cuenta de Google. Solo usa el campo sub como identificador para el usuario, ya que es único entre todas las Cuentas de Google y nunca se reutiliza. No uses una dirección de correo electrónico como identificador, ya que una Cuenta de Google puede tener varias direcciones de correo electrónico en diferentes momentos.

Con los campos email, email_verified y hd, puedes determinar si Google aloja una dirección de correo electrónico y si está autorizada para hacerlo. En los casos en que Google tiene autoridad, se confirma que el usuario es el propietario legítimo de la cuenta.

Casos en los que Google tiene autoridad:

  • email tiene el sufijo @gmail.com. Esta es una cuenta de Gmail.
  • email_verified es verdadero y hd está configurado. Esta es una cuenta de Google Workspace.

Los usuarios pueden registrarse para obtener Cuentas de Google sin usar Gmail o Google Workspace. Cuando email no contiene el sufijo @gmail.com y falta hd, Google no es autorizado y se recomienda usar una contraseña o algún otro método de desafío para verificar al usuario. email_verified también puede ser verdadero, ya que Google verificó inicialmente al usuario cuando se creó la Cuenta de Google. Sin embargo, es posible que la propiedad de la cuenta de correo electrónico de terceros haya cambiado desde entonces.

El campo exp muestra la fecha y hora de vencimiento para que verifiques el token en tu servidor. Es una hora para el token de ID obtenido de Acceder con Google. Debes verificar el token antes de la fecha de vencimiento. No uses exp para la administración de sesiones. Un token de ID vencido no significa que el usuario salió de su cuenta. Tu app es responsable de la administración de las sesiones de tus usuarios.

select_by

En la siguiente tabla, se enumeran los valores posibles para el campo select_by. El tipo de botón que se usa junto con el estado de sesión y consentimiento se utilizan para establecer el valor,

  • El usuario presionó el botón One Tap o Acceder con Google, o bien usó el proceso de acceso automático sin contacto.

  • Se encontró una sesión existente o el usuario seleccionó y accedió a una Cuenta de Google para establecer una sesión nueva.

  • Antes de compartir las credenciales del token de ID con tu app, el usuario puede

    • presionó el botón Confirmar para otorgarle su consentimiento y compartir las credenciales.
    • ya había otorgado consentimiento y usó la opción Seleccionar una cuenta para elegir una Cuenta de Google.

El valor de este campo se establece en uno de estos tipos:

Valor Descripción
auto Acceso automático de un usuario con una sesión existente que antes otorgó consentimiento para compartir credenciales. Solo se aplica a los navegadores que no son compatibles con FedCM.
user Un usuario con una sesión existente que había otorgado su consentimiento presionó el botón "Continuar como" de One Tap para compartir las credenciales. Solo se aplica a navegadores no compatibles con FedCM.
fedcm Un usuario presionó el botón "Continuar como" de One Tap para compartir credenciales mediante FedCM. Solo se aplica a los navegadores compatibles con FedCM.
fedcm_auto Acceso automático de un usuario con una sesión existente que ya había otorgado su consentimiento para compartir credenciales con One Tap de FedCM Solo se aplica a los navegadores compatibles con FedCM.
user_1tap Un usuario con una sesión existente presionó el botón "Continuar como" con One Tap para otorgar su consentimiento y compartir credenciales. Solo se aplica a Chrome v75 y versiones posteriores.
user_2tap Un usuario sin una sesión existente presionó el botón "Continuar como" con One Tap para seleccionar una cuenta y, luego, el botón Confirmar en una ventana emergente para otorgar su consentimiento y compartir credenciales. Se aplica a los navegadores que no están basados en Chromium.
btn Un usuario con una sesión existente que ya otorgó su consentimiento presionó el botón Acceder con Google y seleccionó una Cuenta de Google en “Elegir una cuenta” para compartir las credenciales.
btn_confirm Un usuario con una sesión existente presionó el botón Acceder con Google y el botón Confirmar para otorgar su consentimiento y compartir credenciales.
btn_add_session Un usuario que no tiene una sesión existente y que ya había otorgado su consentimiento presionó el botón Acceder con Google para seleccionar una Cuenta de Google y compartir las credenciales.
btn_confirm_add_session Un usuario sin una sesión existente primero presionó el botón Acceder con Google para seleccionar una Cuenta de Google y, luego, el botón Confirmar para dar su consentimiento y compartir credenciales.

state

Este parámetro solo se define cuando el usuario hace clic en un botón de Acceder con Google para ingresar y se especifica el atributo data-state del botón en el que se hizo clic. El valor de este campo es el mismo que especificaste en el atributo data-state del botón.

Como se pueden renderizar varios botones de Acceder con Google en la misma página, puedes asignar a cada uno una cadena única. Por lo tanto, puedes este parámetro state para identificar en qué botón hizo clic el usuario para acceder.

Extremo del controlador de credenciales de contraseña

El extremo del controlador de credenciales de contraseña procesa las credenciales de contraseña que el administrador de credenciales nativo recupera.

La solicitud HTTP POST contiene la siguiente información:

Formato Nombre Descripción
Cookie g_csrf_token Una string aleatoria que cambia con cada solicitud al extremo del controlador.
Parámetro de solicitud g_csrf_token Una cadena que es igual al valor de la cookie anterior, g_csrf_token.
Parámetro de solicitud email Este token de ID que emite Google.
Parámetro de solicitud password Cómo se selecciona la credencial