Compartir a través de

Escenario: aplicación nativa que llama a API web

Obtenga información sobre cómo crear usuarios de inicio de sesión de aplicaciones nativos autenticados por AD FS 2019 y adquirir tokens mediante la biblioteca MSAL para llamar a las API web.

Antes de leer este artículo, debe estar familiarizado con los conceptos de AD FS y el flujo de concesión de código de autorización.

Overview

Overview

En este flujo, se agrega autenticación a la aplicación nativa (cliente público) para que pueda iniciar la sesión de los usuarios y llamar a una API web. Para llamar a una API web desde una aplicación nativa que inicia la sesión de los usuarios, puede usar el método de adquisición de tokens AcquireTokenInteractive de MSAL. Para habilitar esta interacción, MSAL aprovecha un explorador web.

Para comprender mejor cómo configurar una aplicación nativa en AD FS para adquirir el token de acceso de forma interactiva, vamos a usar un ejemplo disponible aquí y tutorial sobre los pasos de configuración de código y registro de aplicaciones.

Pre-requisites

  • Herramientas de cliente de GitHub
  • AD FS 2019 o posterior configurado y en ejecución
  • Visual Studio 2013 o posterior.

Registro de la aplicación en AD FS

En esta sección, se muestra cómo registrar la aplicación nativa como un cliente público y la API web como usuario de confianza (RP) en AD FS.

  1. En Administración de AD FS, haga clic con el botón derecho en Grupos de aplicaciones y seleccione Agregar grupo de aplicaciones.

  2. En el Asistente para grupos de aplicaciones, en Nombre , escriba NativeAppToWebApi y, en Client-Server aplicaciones , seleccione la aplicación nativa que accede a una plantilla de API web . Haga clic en Next.

    Captura de pantalla de la página principal del Asistente para agregar un grupo de aplicaciones que muestra la plantilla Aplicación nativa accediendo a una API web resaltada.

  3. Copie el valor de Identificador de cliente . Se usará más adelante como valor de ClientId en el archivo App.config de la aplicación. Escriba lo siguiente en URI de redirección:https://ToDoListClient. Haga clic en Agregar. Haga clic en Next.

    Captura de pantalla de la página Aplicación nativa del Asistente para agregar grupos de aplicaciones donde se muestra el URI de redirección.

  4. En la pantalla Configurar API web, escriba el identificador:https://localhost:44321/. Haga clic en Agregar. Haga clic en Next. Este valor se usará más adelante en los archivos App.config y Web.config de la aplicación.

    Captura de pantalla de la página Configurar la API Web del Asistente para agregar grupos de aplicaciones, en la que se muestra el identificador correcto.

  5. En la pantalla Aplicar directiva de control de acceso, seleccione Permitir a todos y haga clic en Siguiente.

    Captura de pantalla de la página Elegir directiva de control de acceso del Asistente para agregar grupos de aplicaciones, en la que se muestra la opción Permitir a todos resaltada.

  6. En la pantalla Configurar permisos de aplicación, asegúrese de que openid está seleccionado y haga clic en Siguiente.

    Captura de pantalla de la página Configurar permisos de aplicación del Asistente para agregar grupos de aplicaciones que muestra la opción openID seleccionada.

  7. En la pantalla Resumen, haga clic en Siguiente.

  8. En la pantalla Completar, haga clic en Cerrar.

  9. En Administración de AD FS, haga clic en Grupos de aplicaciones y seleccione NativeAppToWebApi grupo de aplicaciones. Haga clic con el botón derecho y seleccione Propiedades.

    Captura de pantalla del cuadro de diálogo Administración de A D F S que muestra el grupo NativeAppToWebApi resaltado y la opción Propiedades de la lista desplegable.

  10. En la pantalla de propiedades de NativeAppToWebApi, seleccione NativeAppToWebApi: API Web en API Web y haga clic en Editar....

    Captura de pantalla del cuadro de diálogo de propiedades de NativeAppToWebApi que muestra la aplicación NativeAppToWebApi: A P I Web resaltada.

  11. En la pantalla Propiedades de NativeAppToWebApi: API Web, seleccione la pestaña Reglas de transformación de emisión y haga clic en Agregar regla....

    Captura de pantalla del cuadro de diálogo Propiedades de NativeAppToWebApi: API Web en la que se muestra la pestaña Reglas de transformación de emisión.

  12. En el Asistente para agregar regla de notificación de transformación, seleccione Transformar una notificación entrante en el menú desplegable Plantilla de regla de notificación y haga clic en Siguiente.

    Captura de pantalla de la página Seleccionar plantilla de regla del Asistente para agregar regla de notificación de transformación que muestra seleccionada la opción Transformar una notificación entrante.

  13. Escriba NameID en El nombre de la regla de notificación: campo. Seleccione Nombre para Tipo de notificación entrante:, Id. de nombre para tipo de notificación saliente: y Nombre común para formato de id. de nombre saliente:. Haga clic en Finalizar.

    Captura de pantalla de la página Configurar regla del Asistente para agregar reglas de notificación de transformación que muestra la configuración que se explicó anteriormente.

  14. Haga clic en Aceptar en la pantalla Propiedades de NativeAppToWebApi: API Web y, a continuación, en Propiedades de NativeAppToWebApi.

Configuración de código

En esta sección, se muestra cómo configurar una aplicación nativa para iniciar la sesión del usuario y recuperar un token para llamar a la API Web.

  1. Descargar el ejemplo desde aquí

  2. Abra el ejemplo mediante Visual Studio.

  3. Abra el archivo App.config. Modifique lo siguiente:

    • ida:Authority: escriba https://[your AD FS hostname]/adfs.

    • ida:ClientId: escriba el valor identificador de cliente de #3 en registro de aplicaciones en la sección anterior de AD FS.

    • ida:RedirectUri: escriba el valor URI de redirección de #3 en registro de aplicaciones en la sección anterior de AD FS.

    • todo:TodoListResourceId: escriba el valor identificador de #4 en registro de aplicaciones en la sección anterior de AD FS.

    • ida: todo:TodoListBaseAddress: escriba el valor identificador de #4 en registro de aplicaciones en la sección anterior de AD FS.

      Captura de pantalla del archivo App config, en el que se muestran los valores modificados.

  4. Abra el archivo Web.config. Modifique lo siguiente:

    • ida:Audience: escriba el valor de Identificador de #4 en registro de aplicaciones en la sección anterior de AD FS.

    • ida:AdfsMetadataEndpoint: escriba https://[your AD FS hostname]/federationmetadata/2007-06/federationmetadata.xml.

      Captura de pantalla del archivo Web.config, en el que se muestran los valores modificados.

Pruebe el ejemplo

En esta sección, se muestra cómo probar el ejemplo configurado anteriormente.

  1. Una vez que haya realizado los cambios en el código, recompile la solución.

  2. En Visual Studio, haga clic con el botón derecho en la solución y seleccione Establecer proyectos de inicio....

    Captura de pantalla de la lista que aparece al hacer clic con el botón derecho en la solución con la opción Configurar proyectos de inicio resaltada.

  3. En las páginas Propiedades, asegúrese de que Acción esté establecida en Iniciar para cada uno de los proyectos.

    Captura de pantalla del cuadro de diálogo Páginas de propiedades de la solución que muestra la opción Varios proyectos de inicio seleccionada y todas las acciones de los proyectos establecidas en Inicio.

  4. En la parte superior de Visual Studio, haga clic en la flecha verde.

    Captura de pantalla de la interfaz de usuario de Visual Studio con la opción Inicio resaltada.

  5. En la pantalla principal de la aplicación nativa, haga clic en Iniciar sesión.

    Captura de pantalla del cuadro de diálogo Cliente de lista de tareas.

Si no ve la pantalla de la aplicación nativa, busque y quite los archivos *msalcache.bin de la carpeta donde se guarda el repositorio del proyecto en el sistema.

  1. Se le redirigirá a la página de inicio de sesión de AD FS. Continúe e inicie sesión.

    Captura de pantalla de la página Iniciar sesión.

  2. Una vez que haya iniciado sesión, escriba el texto Build Native App to Web Api en el campo Create a To Do item. Haga clic en Agregar elemento. Esto llamará al servicio de lista de tareas pendientes (API web) y agregará el elemento en la memoria caché.

    Captura de pantalla del cuadro de diálogo Cliente de lista de tareas con el nuevo elemento pendiente en la sección Elementos pendientes.

Pasos siguientes

Flujos de AD FS OpenID Connect/OAuth y escenarios de aplicación

  • Last updated on