Compartir vía

Inicio de sesión de usuarios en una aplicación .NET MAUI de Android de ejemplo

  • Artículo

Se aplica a:Círculo blanco con un símbolo X gris. inquilinos de personal Círculo verde con un símbolo de marca de verificación blanca. inquilinos externos (más información)

En esta guía paso a paso se usa una interfaz de usuario de aplicación multiplataforma de .NET (.NET MAUI) de ejemplo para mostrar cómo agregar autenticación a una aplicación Android mediante un inquilino externo. La aplicación de ejemplo permite a los usuarios iniciar sesión y cerrar sesión. La aplicación .NET MAUI de Android de ejemplo usa la Biblioteca de autenticación de Microsoft (MSAL) para .NET para controlar la autenticación.

En este artículo, realice las tareas siguientes:

  • Registre una aplicación .NET MAUI Android en el inquilino externo.
  • Cree un flujo de usuario de inicio de sesión y cierre de sesión en el inquilino externo.
  • Asocie la aplicación .NET MAUI de Android con el flujo de usuario.
  • Actualice una aplicación .NET MAUI Android de ejemplo para usar sus propios detalles de inquilino externo.
  • Ejecute y pruebe la aplicación .NET MAUI de Android de ejemplo.

Requisitos previos

Registro de la aplicación .NET MAUI de Android

Para permitir que su aplicación inicie la sesión de los usuarios con Microsoft Entra, la id. externa de Microsoft Entra debe tener en cuenta la aplicación que haya creado. El registro de la aplicación establece una relación de confianza entre la aplicación y Microsoft Entra. Al registrar una aplicación, External ID genera un identificador único conocido como Id. de aplicación (cliente), un valor que se usa para identificar la aplicación al crear solicitudes de autenticación.

En los pasos siguientes, se muestra cómo registrar una aplicación en el centro de administración de Microsoft Entra:

  1. Inicie sesión en el Centro de administración de Microsoft Entra al menos como Desarrollador de aplicaciones.

  2. Si tienes acceso a varios inquilinos, usa el icono Configuración en el menú superior para cambiar al inquilino externo desde el menú Directorios y suscripciones.

  3. Ve aIdentidad>Aplicaciones>Registros de aplicaciones.

  4. Seleccione + Nuevo registro.

  5. En la página Registrar una aplicación que aparece;

    1. Introduzca un Nombre de aplicación significativo que se muestre a los usuarios de la aplicación, por ejemplo ciam-client-app.
    2. En Tipos de cuenta admitidos, seleccione Solo las cuentas de este directorio organizativo.

  6. Seleccione Registrar.

  7. Se muestra el panel Información general de la aplicación tras registrarse correctamente. Registre el Id. de la aplicación (cliente) que se usará en el código fuente de la aplicación.

Para especificar el tipo de aplicación en el registro de la aplicación, siga estos pasos:

  1. En Administrar, seleccione Autenticación.
  2. En la página Configuraciones de plataforma, seleccione Agregar una plataforma y, a continuación, seleccione Aplicaciones móviles y de escritorio.
  3. En el URI de redirección escriba msalEnter_the_Application_Id_Here://auth, reemplace Enter_the_Application_Id_Here por el identificador de aplicación (cliente) que copió anteriormente y, a continuación, seleccione Configurar.
  4. Seleccione Guardar para guardar los cambios.

  1. En la página Registros de aplicaciones, seleccione la aplicación que creó (como ciam-client-app) para abrir la página Información general.

  2. En Administrar, seleccione Permisos de API. En la lista Permisos configurados, a la aplicación se le ha asignado el permiso User.Read. Sin embargo, como el inquilino es un inquilino externo, los propios usuarios del consumidor no pueden dar su consentimiento a este permiso. Como administrador, debe dar el consentimiento a este permiso en nombre de todos los usuarios del inquilino:

    1. Seleccione Conceder consentimiento del administrador para <nombre del inquilino> y seleccione Sí.
    2. Seleccione Actualizar y luego compruebe que aparece Concedido para <nombre del inquilino> en Estado para ambos ámbitos.

Creación de un flujo de usuario

Siga estos pasos para crear un flujo de usuario que un cliente pueda usar para iniciar sesión o registrarse en una aplicación.

  1. Inicie sesión en el centro de administración de Microsoft Entra como mínimo un administrador de flujo de usuario de identificador externo.

  2. Si tiene acceso a varios inquilinos, use el icono Configuración en el menú superior para cambiar al inquilino externo desde el menú Directorios y suscripciones.

  3. Vaya a Identidad> Identidades externas> Flujos de usuarios.

  4. Seleccione + Nuevo flujo de usuario.

  5. En la página Crear:

    1. Escriba un nombre para el flujo de usuario, como SignInSignUpSample.

    2. En la lista Proveedores de identidades, seleccione Cuentas de correo electrónico. Este proveedor de identidades permite a los usuarios iniciar sesión o registrarse con su dirección de correo electrónico.

      Nota

      Los proveedores de identidades adicionales se mostrarán aquí solo después de que configure la federación con ellos. Por ejemplo, si configura la federación con Google o Facebook, podrá seleccionar esos proveedores de identidades adicionales aquí.

    3. En Cuentas de correo electrónico, puede seleccionar una de las dos opciones. En este tutorial, seleccione Correo electrónico con contraseña.

      • Correo electrónico con contraseña: permite a los nuevos usuarios registrarse e iniciar sesión con una dirección de correo electrónico como nombre de inicio de sesión y una contraseña como credencial del primer factor.
      • Código de acceso de un solo uso de correo electrónico: permite a los nuevos usuarios registrarse e iniciar sesión con una dirección de correo electrónico como el nombre de inicio de sesión y el código de acceso de un solo uso como credencial del primer factor. El código de acceso de un solo uso de correo electrónico debe estar habilitado en el nivel de inquilino (Todos los proveedores de identidades>Código de acceso de un solo uso de correo electrónico) para que esta opción esté disponible en el nivel de flujo de usuario.

    4. En Atributos de usuario, elija los atributos que quiere recopilar del usuario tras registrarse. Al seleccionar Mostrar más, puede elegir los atributos y las notificaciones de País o región, Nombre para mostrar y Código postal. Seleccione Aceptar. (A los usuarios solo se les solicitan atributos cuando se registran por primera vez).

  6. Seleccione Crear. El nuevo flujo de usuario aparece en la lista Flujos de usuario. Si es necesario, actualice la página.

Para habilitar el autoservicio de restablecimiento de contraseña, siga los pasos descritos en el artículo Habilitar el autoservicio de restablecimiento de contraseña.

Asociación de la aplicación .NET MAUI de Android con el flujo de usuario

Para que los usuarios del cliente vean la experiencia de registro o de inicio de sesión cuando usan la aplicación, debe asociar la aplicación a un flujo de usuario. Aunque muchas aplicaciones se pueden asociar a su flujo de usuario, una sola aplicación solo se puede asociar a un flujo de usuario.

  1. En el menú de la barra lateral, seleccione Identidad.

  2. Seleccione External Identities y, a continuación, Flujos de usuario.

  3. En la página Flujos de usuario, seleccione el nombre del flujo de usuario que creó anteriormente; por ejemplo, SignInSignUpSample.

  4. En Usar, seleccione Aplicaciones.

  5. Seleccione Agregar una aplicación.

  6. Seleccione la aplicación de la lista, como ciam-client-app, o use el cuadro de búsqueda para buscar la aplicación y selecciónela.

  7. Elija Seleccionar.

Una vez que asocie su aplicación con un flujo de usuarios, puede probar su flujo de usuarios simulando la experiencia de registro o inicio de sesión de un usuario con su aplicación desde el centro de administración de Microsoft Entra. Para ello, siga los pasos descritos en Prueba del flujo de usuario de registro e inicio de sesión.

Clonación o descarga de una aplicación .NET MAUI de Android de ejemplo

Para obtener el código de ejemplo de la aplicación .NET MAUI de Android, descargue el archivo .zip o clone la aplicación .NET MAUI de Android de ejemplo desde GitHub mediante la ejecución del siguiente comando:

git clone https://github.com/Azure-Samples/ms-identity-ciam-dotnet-tutorial.git

Configuración de la aplicación .NET MAUI de Android de ejemplo

  1. En Visual Studio, abra el archivo ms-identity-ciam-dotnet-tutorial-main/1-Authentication/2-sign-in-maui/appsettings.json.
  2. Busque el marcador de posición:
    1. Enter_the_Tenant_Subdomain_Here y reemplácelo por el subdominio del directorio (inquilino). Por ejemplo, si el dominio principal del inquilino es contoso.onmicrosoft.com, use contoso. Si no tiene el nombre del inquilino, vea cómo leer los datos del inquilino.
    2. Enter_the_Application_Id_Here y reemplácelo por el identificador de aplicación (cliente) de la aplicación que registró anteriormente.
  3. En Visual Studio, abra el archivo ms-identity-ciam-dotnet-tutorial-main/1-Authentication/2-sign-in-maui/Platforms/Android/AndroidManifest.xml.
  4. Busque el marcador de posición:
    1. Enter_the_Application_Id_Here y reemplácelo por el identificador de aplicación (cliente) de la aplicación que registró anteriormente.

Ejecución y prueba de la aplicación .NET MAUI de Android de ejemplo

Las aplicaciones .NET MAUI están diseñadas para ejecutarse en varios sistemas operativos y dispositivos. Deberá seleccionar el destino con el que quiere probar y depurar la aplicación.

Establezca el Destino de depuración en la barra de herramientas de Visual Studio en el dispositivo con el que desea depurar y probar. En los siguientes pasos se muestra cómo establecer el Destino de depuración en Android:

  1. Seleccione la lista desplegable Destino de depuración.
  2. Seleccione Android Emulators.
  3. Seleccione el dispositivo del emulador.

Ejecute la aplicación presionando F5 o seleccionando el botón reproducir situado en la parte superior de Visual Studio.

  1. Ahora puede probar la aplicación .NET MAUI de Android de ejemplo. Después de ejecutar la aplicación, la ventana de la aplicación de Android aparece en un emulador:

    Captura de pantalla del botón de inicio de sesión en la aplicación de Android.

  2. En la ventana de Android que aparece, seleccione el botón Iniciar sesión. Se abre una ventana del explorador y se le pide que inicie sesión.

    Captura de pantalla de la solicitud de usuario para escribir las credenciales en la aplicación de Android.

    Durante el proceso de inicio de sesión, se le pedirá que conceda varios permisos (para permitir que la aplicación acceda a los datos). Tras iniciar sesión y dar su consentimiento correctamente, la pantalla de la aplicación muestra la página principal.

    Captura de pantalla de la página principal de la aplicación de Android tras iniciar sesión.

Pasos siguientes