Conectar el inicio de sesión con Google

Para que los usuarios de su servicio se registren con una cuenta de Google, primero tiene que registrar su servicio en Google y obtener el ID de cliente y el secreto del cliente.

Esta página explica en qué orden se obtienen el ID de cliente y el secreto del cliente. Cómo introducir en WEEGLOO los dos valores obtenidos está en Introducir el ID de cliente y el secreto del cliente en WEEGLOO, y cómo hacer que en la pantalla de consentimiento aparezcan el nombre y el logotipo de su servicio está en Mostrar el nombre y el logotipo de su servicio en la pantalla de consentimiento.

Obtener el ID de cliente y el secreto del cliente en Google

Los cuatro pasos siguientes se realizan en Google Cloud Console. Tiene que haber iniciado sesión con su cuenta de Google. Lo que se hace aquí no tiene coste.

Si usa varias cuentas de Google, al pulsar un enlace este puede abrirse con una cuenta que no era la que quería. Pulse la foto de perfil de la parte superior derecha de la pantalla para comprobar de qué cuenta se trata y, si no es la que quería, cambie de cuenta.

1

Crear un proyecto

Si ya tiene un proyecto que venía usando, puede usar ese mismo en lugar de crear uno nuevo. En ese caso, salte este paso y pase a Configurar la pantalla de consentimiento.

  1. Abra la pantalla de proyecto nuevo (https://console.cloud.google.com/projectcreate (se abre en una pestaña nueva)).

  2. En Nombre del proyecto, escriba un nombre que reconozca más adelante (por ejemplo, Armario Acogedor).

  3. Pulse Crear.

    Pantalla de proyecto nuevo. En el nombre del proyecto está escrito "Armario Acogedor" y debajo está el botón Crear

  4. Compruebe que el nombre del proyecto que aparece en la parte superior de la consola es el que acaba de crear.

3

Crear el cliente de OAuth

En el cliente que crea aquí se registra la dirección a la que vuelve el resultado del inicio de sesión.

  1. Abra la pantalla Clientes de Google Auth Platform (https://console.cloud.google.com/auth/clients (se abre en una pestaña nueva)).

  2. Pulse Crear cliente.

    Pantalla Clientes. La lista de IDs de clientes de OAuth 2.0 está vacía y arriba se ve Crear cliente

  3. En Tipo de aplicación, elija Aplicación web.

    El desplegable de tipo de aplicación está abierto y muestra seis tipos, entre ellos Aplicación web

  4. En Nombre, escriba un nombre con el que reconozca este cliente (por ejemplo, Armario Acogedor).

  5. Deje vacío Orígenes autorizados de JavaScript.

  6. Pulse Agregar URI en URIs de redireccionamiento autorizados.

  7. En la casilla que aparece, pegue la dirección de abajo. Si elige su Space, el identificador queda puesto.

    Space
    https://auth.weegloo.com/v1/spaces/{spaceId}/login/oauth2/code/google

    Si no sabe cuál es su Space y dejó la integración en manos de un agente de IA, también puede preguntárselo al agente. Pida en la ventana de chat «Dime la dirección de redireccionamiento que hay que registrar en el inicio de sesión con Google» y recibirá la dirección ya completa.

  8. Pulse Crear.

    Formulario con la dirección puesta en URIs de redireccionamiento autorizados. Orígenes autorizados de JavaScript está vacío

En la lista también hay tipos como Android o iOS, pero elija Aplicación web también cuando vaya a añadir el inicio de sesión a una aplicación móvil. Es porque el resultado del inicio de sesión no vuelve a su app, sino a la dirección web de WEEGLOO. Nombre sirve para distinguir el cliente en las pantallas de Google y los usuarios no lo ven.

La dirección registrada puede no aplicarse de inmediato

Debajo del formulario está este aviso de Google: "Nota: La configuración puede tardar entre 5 minutos y algunas horas en aplicarse". Justo después de registrar la dirección puede que todavía no se haya aplicado y el inicio de sesión quede bloqueado. En ese caso, deje pasar un tiempo y vuelva a intentarlo.

4

Copiar el ID de cliente y el secreto del cliente

Al pulsar Crear aparece la ventana Se creó el cliente de OAuth. El ID de cliente y el secreto del cliente que figuran aquí son los que introducirá en WEEGLOO.

Si cierra la ventana no podrá volver a ver el secreto del cliente

Esta ventana lleva el aviso "Ya no podrás ver ni descargar el secreto del cliente una vez que cierres este diálogo". Copie el ID de cliente y el secreto del cliente antes de cerrar la ventana. Si quiere recibir los valores en un archivo, puede pulsar Descargar JSON.

  1. Pulse el icono de copiar que está a la derecha de ID de cliente para copiar el valor.

  2. Pulse el icono de copiar que está a la derecha de Secreto del cliente para copiar el valor.

  3. Cuando haya guardado tanto el ID de cliente como el secreto del cliente, pulse Aceptar.

    Ventana Se creó el cliente de OAuth. Se ven el ID de cliente, el secreto del cliente y el aviso de que no se podrán volver a ver

Estas son las casillas del estudio de contenidos en las que van el ID de cliente y el secreto del cliente.

Pantalla de GoogleEstudio de contenidos
ID de clienteClient ID
Secreto del clienteClient Secret

El secreto del cliente es un secreto, tal como dice su nombre. No se lo dé a nadie ni lo escriba en un sitio público.

Introducir el ID de cliente y el secreto del cliente en WEEGLOO

Ahora ya tiene el ID de cliente y el secreto del cliente. A partir de aquí el camino se divide según cómo haya venido trabajando hasta ahora.

Si estaba configurándolo directamente en el estudio de contenidos, siga estos pasos.

  1. Vuelva a la sección Activar el inicio de sesión social de Inicio de sesión de miembros del servicio.
  2. Active Google.
  3. Introduzca el ID de cliente en la casilla Client ID del Step 2.
  4. Introduzca el secreto del cliente en la casilla Client Secret.
  5. Pulse Guardar.

Si dejó la integración en manos de un agente de IA y este le indicó que fuera a obtener el ID de cliente y el secreto del cliente, pegue tal cual los dos valores obtenidos en la ventana de chat y siga con lo que estaba haciendo. El resto de la configuración lo continúa el agente.

Mostrar el nombre y el logotipo de su servicio en la pantalla de consentimiento

En la pantalla de consentimiento que aparece cuando un usuario inicia sesión con una cuenta de Google se muestra al principio el dominio de WEEGLOO en lugar del nombre de su servicio. Al usuario le cuesta reconocer en qué servicio se está registrando, y también distinguirlo de un sitio falso montado de forma parecida. Si aparecen el nombre y el logotipo de su servicio, el usuario puede registrarse con confianza.

El inicio de sesión funciona también así, de modo que esto no es obligatorio. Se recomienda hacerlo antes de abrir el servicio al público. El nombre y el logotipo aparecen una vez que obtiene la verificación de la marca (se abre en una pestaña nueva) de Google.

1

Preparar la página de inicio y la política de privacidad

Google comprueba con la página de inicio si el nombre que se mostrará en la pantalla de consentimiento es el del servicio real. Prepare en su sitio una página de inicio y una política de privacidad.

Si dejó la integración en manos de un agente de IA, pídale «Créame la página de inicio y la política de privacidad que hacen falta para la verificación de la marca de Google».

  • Página de inicio: una página que se abre sin iniciar sesión, explica el servicio y enlaza con la política de privacidad. El botón de inicio de sesión se deja en otra página.
  • Política de privacidad: una página, bajo la misma dirección que la página de inicio, que explica cómo se usa y se conserva la información obtenida de la cuenta de Google.

Las condiciones del servicio son opcionales.

2

Verificar el sitio en Search Console

Que la página de inicio es suya se demuestra con Google Search Console.

Si dejó la integración en manos de un agente de IA, suba a la ventana de chat el archivo que obtiene en el punto 5 de abajo y pídale «Mete este archivo en el sitio y vuelve a desplegarlo». Del punto 6 se encarga el agente.

  1. Abra Search Console (https://search.google.com/search-console (se abre en una pestaña nueva)). Tiene que ser una cuenta propietaria o editora del proyecto de Google Cloud.

  2. Pulse Agregar sitio web. Si ya tiene un sitio registrado, pulse Agregar propiedad en el menú de selección de propiedad de la parte superior izquierda y después pulse Agregar sitio web.

  3. En la casilla Prefijo de la URL de la ventana Seleccionar tipo de propiedad, escriba la dirección de la página de inicio (por ejemplo, https://armario-acogedor.weegloo.app/).

  4. Pulse Continuar en el lado de Prefijo de la URL.

  5. En Archivo HTML de la ventana Verifica la propiedad, pulse el botón con el nombre del archivo para descargarlo. Deje esta ventana abierta.

    Ventana Verifica la propiedad de Search Console. Está desplegado Archivo HTML, el método de verificación recomendado, y se ven el botón con el nombre del archivo que hay que descargar, la dirección de la página de inicio a la que subirlo y, debajo, el botón Verificar

  6. Ponga el archivo obtenido, con ese mismo nombre, en la carpeta superior del sitio y vuelva a desplegarlo (Volver a subir el sitio tras modificarlo).

  7. Vuelva a la ventana Verifica la propiedad y pulse Verificar.

Cuando aparece Se ha verificado la propiedad, este paso ha terminado.

No borre el archivo de verificación

Search Console vuelve a comprobar cada cierto tiempo si este archivo sigue estando. Inclúyalo también cuando vuelva a subir el sitio.

3

Rellenar la información de la marca

Comunique a Google las páginas que ha preparado, el nombre que se mostrará y el logotipo.

  1. Abra la pantalla Información de la marca de Google Auth Platform (https://console.cloud.google.com/auth/branding (se abre en una pestaña nueva)).

  2. En Nombre de la aplicación, escriba exactamente el mismo nombre de servicio que puso en la página de inicio. No se pueden poner nombres de productos de Google.

  3. En Logotipo de la aplicación, suba el logotipo propio de su servicio. Si usa el logotipo de otra marca, no se verifica. El archivo es un JPG, PNG o BMP de 1MB o menos, y un cuadrado de 120×120px es el que mejor se ve.

  4. En Página principal de la aplicación y Enlace a la política de privacidad de la aplicación, ponga las direcciones de la página de inicio y de la política de privacidad. Si tiene condiciones del servicio, póngalas también en Enlace a las condiciones del servicio de la aplicación.

  5. En Dominios autorizados, ponga weegloo.app.

    • Si no hay ninguna entrada, pulse Agregar un dominio y escríbalo.
    • Si ya hay una entrada, cambie el valor de esa casilla por weegloo.app. Puede que la entrada existente no se pueda eliminar. En ese caso basta con cambiar el valor.

    Sección Dominios autorizados de la pantalla Información de la marca. El valor de la casilla Dominio autorizado 1 está cambiado por el dominio de Web Hosting y, debajo, se ve el botón Agregar un dominio

  6. Pulse Guardar.

4

Solicitar la verificación y publicar

La verificación de la marca se puede solicitar después de publicar la aplicación. En estado de prueba no aparece el botón de verificación.

  1. En la pantalla Público, pulse Publicar aplicación.
  2. En la ventana ¿Enviar a producción?, pulse Confirmar.
  3. En Estado de la verificación de la pantalla Información de la marca, pulse Verificar la información de la marca. La verificación tarda unos 5 minutos como mucho.
  4. Si hay algo que corregir, consulte el contenido en Ver problemas. Después de corregirlo, elija He solucionado los problemas y vuelva a solicitarlo.
  5. Si pasa la verificación, pulse Publicar la información de la marca dentro de los 7 días siguientes.

Al publicarla, en la pantalla de consentimiento aparecen el nombre y el logotipo de su servicio.

Qué hacer a continuación

  • Inicio de sesión de miembros del servicio: introduzca los valores obtenidos en el estudio de contenidos y termine el resto de la configuración del inicio de sesión de miembros.
  • Roles y permisos de los miembros: cree el ServiceUserRole que define qué puede ver y usar un miembro registrado.
  • Auth API: trata especificaciones técnicas, como el formato de las solicitudes, que necesita para integrar el inicio de sesión en el código de su sitio.