Autentica usuarios con identidades externas

En esta guía de inicio rápido, se muestra cómo proteger una aplicación con Identity-Aware Proxy (IAP) y las identidades externas. Cuando combinas IAP con Identity Platform, puedes autenticar usuarios con una amplia variedad de proveedores de identidad, como OAuth, SAML y OIDC, además de las Cuentas de Google.

En esta guía de inicio rápido, protegerás una aplicación de App Engine de muestra con la autenticación de Facebook.

Antes de comenzar

  1. In the Google Cloud console, on the project selector page, select or create a Google Cloud project.

    Go to project selector

  2. Asegúrate de que la facturación esté habilitada para tu proyecto de Google Cloud.

  3. Install the Google Cloud CLI, then initialize it by running the following command: 

    gcloud init

  4. Inicializa App Engine para tu proyecto:

    gcloud app create --project=project-id

  5. Instala Git.

  6. Instalar una versión actual de Node.js

  7. Instala la herramienta de línea de comandos de Firebase:

    npm install -g firebase-tools

Habilita las API

Primero, habilita Identity Platform:

  1. Ve a la página Marketplace de Identity Platform en la Consola de Google Cloud

    Ir a la página Marketplace de Identity Platform

  2. Haz clic en Habilitar Identity Platform. Aparecerá la página Identity Platform en la consola de Google Cloud.

Luego, habilita IAP:

  1. Ve a la página IAP en la consola de Google Cloud.

    Ir a la página de IAP

  2. Selecciona el mismo proyecto que usaste para Identity Platform. No se admite el uso de proyectos diferentes.

  3. Haz clic en Habilitar API.

Descarga y, luego, implementa el código de muestra

El código de esta guía de inicio rápido tiene dos componentes: una aplicación de cliente y una aplicación de autenticación.

La aplicación de cliente está protegida con IAP. Cuando recibe una solicitud de un usuario no autenticado, redirecciona la solicitud a la aplicación de autenticación para verificar la identidad del usuario. Si el usuario accede correctamente, la aplicación de autenticación responde con un token web JSON (JWT). A modo de demostración, la aplicación de cliente muestra el JWT.

Primero, descarga el código y, luego, implementa la aplicación de cliente:

  1. Descarga el código de muestra:

    git clone https://github.com/GoogleCloudPlatform/iap-gcip-web-toolkit.git

  2. Cambia al directorio de la aplicación de cliente:

    cd iap-gcip-web-toolkit/sample/app

  3. Instala las dependencias:

    npm install

  4. Implementa la aplicación de cliente en App Engine:

    npm run deploy

    La aplicación de cliente se inicia en la URL:

    https://[PROJECT-ID].appspot.com

A continuación, implementa la aplicación de autenticación:

  1. Cambia al directorio de la aplicación de autenticación:

    cd ../authui-firebaseui

  2. Instala las dependencias:

    npm install

  3. Configura la aplicación de autenticación para usar Firebase Hosting. Especifica Google Cloud ID del proyecto de Google Cloud que contiene la IAP app cliente protegida:

    firebase use project-id

  4. Implementa la app:

    npm run deploy

    La aplicación de autenticación se inicia en la URL:

    https://[PROJECT-ID].firebaseapp.com

Implementaste las aplicaciones de cliente y de autenticación. El siguiente paso es configurar Identity Platform y, también, IAP.

Configura Identity Platform

IAP usa Identity Platform para autenticar identidades externas. En esta guía de inicio rápido, se usa Facebook como ejemplo, pero Identity Platform es compatible con una amplia variedad de proveedores de identidad.

Crea una aplicación de Facebook

Para autenticar usuarios con Facebook, necesitas un ID de aplicación y un secreto de aplicación.

  1. Accede a Facebook para desarrolladores. Si aún no tienes una cuenta de Facebook, deberás crear una.

  2. Ve a la página de aplicaciones de Facebook.

  3. Haz clic en Agregar una nueva aplicación.

  4. En el menú de la izquierda, selecciona Configuración > Básico.

  5. En el cuadro URL de la Política de Privacidad, ingresa una URL válida. Si implementas la aplicación en producción más adelante, puedes actualizar la URL para que apunte a tu Política de Privacidad.

  6. Toma nota de tu ID de aplicación y el secreto de la aplicación. Los necesitarás en la siguiente sección.

Agrega Facebook como proveedor de identidad

Configura Identity Platform a fin de usar Facebook para la autenticación:

  1. Ve a la página Proveedores de identidad en la consola de Google Cloud.

    Ir a la página Proveedores de identidad

  2. Haz clic en Agregar un proveedor.

  3. Selecciona Facebook de la lista de proveedores.

  4. Ingresa el ID de la aplicación y el secreto de la aplicación que obtuviste en la sección anterior.

  5. Haz clic en Guardar.

Configura el URI de redireccionamiento de OAuth

Cuando Facebook termina de procesar una solicitud desde la aplicación de autenticación, necesita un URI al que redireccionar.

  1. Vuelve a la página de aplicaciones de Facebook y selecciona tu aplicación.

  2. En el menú de la izquierda, haz clic en Productos.

  3. Busca el producto Acceso con Facebook y haz clic en Configurar.

  4. En el menú de navegación de la izquierda, selecciona Configuración (no es necesario completar el flujo de la guía de inicio rápido guiado).

  5. En el cuadro URI de redireccionamiento de OAuth válido, ingresa el URI de redireccionamiento:

    https://project-id.firebaseapp.com/__/auth/handler

    También puedes encontrar este URI en la página de configuración del proveedor de Identity Platform.

  6. Haz clic en Guardar cambios.

¡Terminaste de configurar Identity Platform! Ahora puedes configurar IAP para usarlo en la autenticación.

Habilita IAP para usar identidades externas

  1. Ve a la página de IAP en la consola de Google Cloud.

    Ir a la página de IAP

  2. Haz clic en la pestaña Aplicaciones.

  3. Selecciona la aplicación de App Engine de muestra que implementaste anteriormente. La URL en la categoría Publicada (Published) debe ser similar a la siguiente:

    https://project-id.appspot.com

  4. En la columna IAP, activa la opción Activado (On).

  5. En el panel lateral, haz clic en Iniciar para Usar identidades externas para autorización.

  6. En la página de acceso, selecciona La ingresaré por mi cuenta.

  7. En el campo URL de autenticación (Authentication URL), ingresa la URL de la aplicación de autenticación. Debe verse de la siguiente manera:

    https://project-id.firebaseapp.com/

    Después de ingresar la URL, la consola de Google Cloud agrega automáticamente tu clave de API.

  8. Marca la casilla con el nombre del proyecto. Debe tener Facebook como un proveedor de identidad.

  9. Haz clic en Guardar.

Terminaste de configurar IAP.

Prueba la autenticación de usuarios

Para probar que IAP protege tu app y autentica a los usuarios con Facebook, haz lo siguiente:

  1. Ve a la aplicación de cliente de App Engine en tu navegador:

    https://project-id.appspot.com

    Después de una breve pantalla de carga, se te redireccionará a la página de acceso de Identity Platform.

  2. Sigue las indicaciones en pantalla para autenticar con Facebook.

  3. Se te debería redireccionar a la aplicación de cliente, que permitirá ver el JWT que muestra Identity Platform.

Para salir por completo, debes salir de la app de ejemplo que creaste y de Facebook. Debes salir de ambas apps porque Firebase establece una sesión con Facebook, que es válido por una hora. Para obtener más información, consulta Administra sesiones de usuario.

¡Felicitaciones! Implementaste correctamente una aplicación en App Engine y la protegiste con IAP y las identidades externas.

Limpia

Sigue estos pasos para evitar que se apliquen cargos a tu cuenta de Google Cloud por los recursos que usaste en esta página.

  1. En la consola de Google Cloud, ve a la página Administrar recursos.

    Ir a Administrar recursos

  2. En la lista de proyectos, elige el proyecto que quieres borrar y haz clic en Borrar.
  3. En el diálogo, escribe el ID del proyecto y, luego, haz clic en Cerrar para borrar el proyecto.

Además, es posible que desees borrar la aplicación de Facebook que creaste.

¿Qué sigue?