Tutorial: Acceso a Microsoft Graph desde una aplicación .NET protegida como usuario

Aprenda a acceder a Microsoft Graph desde una aplicación web que se ejecuta en Azure App Service.

Diagram that shows accessing Microsoft Graph.

Quiere agregar acceso a Microsoft Graph desde la aplicación web y realizar alguna acción como el usuario que ha iniciado sesión. En esta sección se describe cómo conceder permisos delegados a la aplicación web y cómo obtener la información de perfil del usuario con la sesión iniciada desde Microsoft Entra ID.

En este tutorial, aprenderá a:

  • Conceder permisos delegados a una aplicación web
  • Llamar a Microsoft Graph desde una aplicación web para el usuario que ha iniciado sesión

Si no tiene una suscripción a Azure, cree una cuenta gratuita de Azure antes de empezar.

Requisitos previos

Concesión de acceso de front-end para llamar a Microsoft Graph

Ahora que ha habilitado la autenticación y la autorización en la aplicación web, esta se registra con la plataforma de identidad de Microsoft y se respalda mediante una aplicación de Microsoft Entra ID. En este paso, concederá a la aplicación web permisos para acceder a Microsoft Graph para el usuario (técnicamente, asignará a la aplicación de Microsoft Entra de la aplicación web los permisos para acceder a Microsoft Graph de Microsoft Entra para el usuario).

  1. En el centro de administración de Microsoft Entra, seleccione Aplicaciones.

  2. Seleccione Registros de aplicaciones>Aplicaciones propias>View all applications in this directory (Ver todas las aplicaciones de este directorio). Seleccione el nombre de la aplicación web y, después, Permisos de API.

  3. Seleccione Agregar un permiso; después, seleccione las API de Microsoft y Microsoft Graph.

  4. Seleccione Permisos delegados y, después, User.Read en la lista. Seleccione Agregar permisos.

Configuración de App Service para devolver un token de acceso que se pueda usar

La aplicación web ya tiene los permisos necesarios para acceder a Microsoft Graph como usuario con la sesión iniciada. En este paso, configurará la autenticación y autorización de App Service para proporcionarle un token de acceso que se pueda usar para acceder a Microsoft Graph. Para este paso, debe agregar el ámbito User.Read para el servicio de bajada (Microsoft Graph): https://graph.microsoft.com/User.Read.

Importante

Si no configura App Service para que devuelva un token de acceso utilizable, recibirá un error CompactToken parsing failed with error code: 80049217 al llamar a Microsoft Graph API en el código.

Vaya a Azure Resource Explorer y, mediante el árbol de recursos, busque la aplicación web. La dirección URL del recurso debe ser similar a https://resources.azure.com/subscriptions/subscriptionId/resourceGroups/SecureWebApp/providers/Microsoft.Web/sites/SecureWebApp20200915115914.

Se abre ahora Azure Resource Explorer con la aplicación web seleccionada en el árbol de recursos.

  1. En la parte superior de la página, seleccione Read/Write (Lectura/escritura) para permitir la edición de los recursos de Azure.

  2. En el explorador izquierdo, explore en profundidad hasta config>authsettingsV2.

  3. En la vista authsettingsV2, seleccione Editar.

  4. Busque la sección login (iniciar sesión) de identityProviders->azureActiveDirectory y agregue la siguiente configuración de loginParameters: "loginParameters":[ "response_type=code id_token","scope=openid offline_access profile https://graph.microsoft.com/User.Read" ].

    "identityProviders": {
        "azureActiveDirectory": {
          "enabled": true,
          "login": {
            "loginParameters":[
              "response_type=code id_token",
              "scope=openid offline_access profile https://graph.microsoft.com/User.Read"
            ]
          }
        }
      }
    },
    
  5. Seleccione PUT para guardar la configuración. Puede que esta configuración tarde varios minutos en surtir efecto. La aplicación web ya está configurada para acceder a Microsoft Graph con un token de acceso adecuado. Si no lo hace, Microsoft Graph devuelve un error que indica que el formato del token compacto no es correcto.

Llamada a Microsoft Graph con .NET

La aplicación web dispone ahora de los permisos necesarios y también agrega el identificador de cliente de Microsoft Graph a los parámetros de inicio de sesión.

Mediante la biblioteca Microsoft.Identity.Web, la aplicación web obtiene un token de acceso para la autenticación con Microsoft Graph. En la versión 1.2.0 y versiones posteriores, la biblioteca Microsoft.Identity.Web se integra con el módulo de autenticación y autorización de App Service y se puede ejecutar junto con este. Microsoft.Identity.Web detecta que la aplicación web se hospeda en App Service y obtiene el token de acceso del módulo de autenticación y autorización de App Service. Después, el token de acceso se pasa a las solicitudes autenticadas con Microsoft Graph API.

Para ver este código como parte de una aplicación de ejemplo, consulte el:

Nota

La biblioteca Microsoft.Identity.Web no es necesaria en la aplicación web para la autenticación o autorización básicas, ni para autenticar solicitudes con Microsoft Graph. Es posible llamar de forma segura a las API de bajada solo con el módulo de autenticación y autorización de App Service habilitado.

Sin embargo, este módulo está diseñado para escenarios de autenticación más básicos. Para escenarios más complejos (por ejemplo, el control de notificaciones personalizadas), necesita la biblioteca Microsoft.Identity.Web o la biblioteca de autenticación de Microsoft. Hay un poco más de trabajo de configuración al principio, pero la biblioteca Microsoft.Identity.Web se puede ejecutar junto con el módulo de autenticación y autorización de App Service. Más adelante, cuando la aplicación web necesite trabajar con escenarios más complejos, puede deshabilitar el módulo de autenticación y autorización de App Service y la biblioteca Microsoft.Identity.Web ya formará parte de la aplicación.

Instalación de los paquetes de biblioteca cliente

Instale los paquetes NuGet Microsoft.Identity.Web and Microsoft.Identity.Web.MicrosoftGraph en el proyecto utilizando la interfaz de la línea de comandos de .NET Core o la consola del administrador de paquetes de Visual Studio.

Línea de comandos de .NET Core

Abra una línea de comandos y cambie al directorio que contiene el archivo del proyecto.

Ejecute los comandos de instalación.

dotnet add package Microsoft.Identity.Web.MicrosoftGraph

dotnet add package Microsoft.Identity.Web

Consola del Administrador de paquetes

Abra el proyecto o la solución en Visual Studio y abra la consola mediante Herramientas>Administrador de paquetes NuGet>Consola del Administrador de paquetes.

Ejecute los comandos de instalación.

Install-Package Microsoft.Identity.Web.GraphServiceClient

Install-Package Microsoft.Identity.Web

Startup.cs

En el archivo Startup.cs, el método AddMicrosoftIdentityWebApp permite agregar Microsoft.Identity.Web a la aplicación web. El método AddMicrosoftGraph agrega compatibilidad con Microsoft Graph. Para obtener información sobre cómo administrar el consentimiento incremental y el acceso condicional, lea esto.

using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Extensions.Hosting;
using Microsoft.Identity.Web;
using Microsoft.AspNetCore.Authentication.OpenIdConnect;

// Some code omitted for brevity.
public class Startup
{
    // This method gets called by the runtime. Use this method to add services to the container.
    public void ConfigureServices(IServiceCollection services)
    {
      services.AddOptions();
      string[] initialScopes = Configuration.GetValue<string>("DownstreamApi:Scopes")?.Split(' ');

      services.AddAuthentication(OpenIdConnectDefaults.AuthenticationScheme)
              .AddMicrosoftIdentityWebApp(Configuration.GetSection("AzureAd"))
              .EnableTokenAcquisitionToCallDownstreamApi(initialScopes)
                      .AddMicrosoftGraph(Configuration.GetSection("DownstreamApi"))
                      .AddInMemoryTokenCaches(); 

      services.AddAuthorization(options =>
      {
          // By default, all incoming requests will be authorized according to the default policy
          options.FallbackPolicy = options.DefaultPolicy;
      });
      services.AddRazorPages()
          .AddMvcOptions(options => {})                
          .AddMicrosoftIdentityUI();

      services.AddControllersWithViews()
              .AddMicrosoftIdentityUI();
    }
}

appsettings.json

AzureAd especifica la configuración de la biblioteca Microsoft.Identity.Web. En el Centro de administración de Microsoft Entra, seleccione Aplicaciones en el menú del portal y a continuación, seleccione Registros de aplicaciones. Seleccione el registro de aplicaciones creado al habilitar el módulo de autenticación y autorización de App Service; este registro debe tener el mismo nombre que la aplicación web. Puede encontrar el identificador de inquilino y el identificador de cliente en la página de información general del registro de aplicaciones. El nombre de dominio se puede encontrar en la página de información general de Microsoft Entra ID del inquilino.

Graph especifica el punto de conexión de Microsoft Graph y los ámbitos iniciales que necesita la aplicación.

{
  "AzureAd": {
    "Instance": "https://login.microsoftonline.com/",
    "Domain": "[Enter the domain of your tenant, e.g. contoso.onmicrosoft.com]",
    "TenantId": "[Enter 'common', or 'organizations' or the Tenant Id (Obtained from the Microsoft Entra admin center. Select 'Endpoints' from the 'App registrations' blade and use the GUID in any of the URLs), e.g. da41245a5-11b3-996c-00a8-4d99re19f292]",
    "ClientId": "[Enter the Client Id (Application ID obtained from the Microsoft Entra admin center), e.g. ba74781c2-53c2-442a-97c2-3d60re42f403]",
    "ClientSecret": "[Copy the client secret added to the app from the Microsoft Entra admin center]",
    "ClientCertificates": [
    ],
    // the following is required to handle Continuous Access Evaluation challenges
    "ClientCapabilities": [ "cp1" ],
    "CallbackPath": "/signin-oidc"
  },
  "DownstreamApis": {
    "MicrosoftGraph": {
      // Specify BaseUrl if you want to use Microsoft graph in a national cloud.
      // See https://learn.microsoft.com/graph/deployments#microsoft-graph-and-graph-explorer-service-root-endpoints
      // "BaseUrl": "https://graph.microsoft.com/v1.0",

      // Set RequestAppToken this to "true" if you want to request an application token (to call graph on 
      // behalf of the application). The scopes will then automatically
      // be ['https://graph.microsoft.com/.default'].
      // "RequestAppToken": false

      // Set Scopes to request (unless you request an app token).
      "Scopes": [ "User.Read" ]

      // See https://aka.ms/ms-id-web/downstreamApiOptions for all the properties you can set.
    }
  },
  "Logging": {
    "LogLevel": {
      "Default": "Information",
      "Microsoft": "Warning",
      "Microsoft.Hosting.Lifetime": "Information"
    }
  },
  "AllowedHosts": "*"
}

Llamada a Microsoft Graph en nombre del usuario

En el ejemplo siguiente se muestra cómo llamar a Microsoft Graph como el usuario con la sesión iniciada y cómo obtener la información del usuario. El objeto GraphServiceClient se ha insertado en el controlador y la biblioteca Microsoft.Identity.Web ha configurado la autenticación.

// Index.cshtml.cs
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc.RazorPages;
using Microsoft.Graph;
using System.IO;
using Microsoft.Identity.Web;
using Microsoft.Extensions.Logging;

// Some code omitted for brevity.

[AuthorizeForScopes(Scopes = new[] { "User.Read" })]
public class IndexModel : PageModel
{
    private readonly ILogger<IndexModel> _logger;
    private readonly GraphServiceClient _graphServiceClient;

    public IndexModel(ILogger<IndexModel> logger, GraphServiceClient graphServiceClient)
    {
        _logger = logger;
        _graphServiceClient = graphServiceClient;
    }

    public async Task OnGetAsync()
    {
        try
        {
            var user = await _graphServiceClient.Me.GetAsync();
            ViewData["Me"] = user;
            ViewData["name"] = user.DisplayName;

            using (var photoStream = await _graphServiceClient.Me.Photo.Content.GetAsync())
            {
                byte[] photoByte = ((MemoryStream)photoStream).ToArray();
                ViewData["photo"] = Convert.ToBase64String(photoByte);
            }
        }
        catch (Exception ex)
        {
            ViewData["photo"] = null;
        }
    }
}

Limpieza de recursos

Si ha completado todos los pasos de este tutorial de varias partes, habrá creado una aplicación de App Service, un plan de hospedaje de App Service y una cuenta de almacenamiento en un grupo de recursos. También ha creado un registro de aplicación en Microsoft Entra ID. Cuando ya no lo necesite, elimine estos recursos y el registro de aplicaciones para que no continúe acumulando gastos.

En este tutorial, aprenderá a:

  • Eliminar los recursos de Azure creados mientras seguía el tutorial.

Eliminar el grupo de recursos

En Azure Portal, seleccione Grupos de recursos en el menú del portal y seleccione el grupo de recursos que contenga su instancia de App Service y el plan de esta.

Seleccione Eliminar grupo de recursos para eliminar el grupo de recursos y todos los recursos.

Screenshot that shows deleting the resource group.

Este comando puede tardar varios minutos en ejecutarse.

Eliminación del registro de aplicaciones

En el Centro de administración de Microsoft Entra, seleccione Aplicaciones>Registros de aplicaciones. A continuación, seleccione la aplicación que ha creado. Screenshot that shows selecting app registration.

En la información general del registro de aplicaciones, seleccione Eliminar. Screenshot that shows deleting the app registration.

Pasos siguientes

En este tutorial, ha aprendido a:

  • Conceder permisos delegados a una aplicación web
  • Llamar a Microsoft Graph desde una aplicación web para el usuario que ha iniciado sesión