Tutorial: Acceso a Microsoft Graph desde una aplicación segura como usuario
Aprenda a acceder a Microsoft Graph desde una aplicación web que se ejecuta en Azure App Service.
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
- Una aplicación web que se ejecuta en Azure App Service que tiene el módulo de autenticación y autorización de App Service habilitado.
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).
En el menú Centro de administración de Microsoft Entra, seleccione Aplicaciones.
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.
Seleccione Agregar un permiso; después, seleccione las API de Microsoft y Microsoft Graph.
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. En la parte superior de la página, seleccione Read/Write (Lectura/escritura) para permitir la edición de los recursos de Azure.
En el explorador izquierdo, explore en profundidad hasta config>authsettingsV2.
En la vista authsettingsV2, seleccione Editar. 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"
]
}
}
}
},
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
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 ejemplo en GitHub.
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.GraphServiceClient en el proyecto utilizando la interfaz de la línea de comandos (CLI) de .NET o la consola del administrador de paquetes de Visual Studio.
CLI de .NET
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.GraphServiceClient
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.
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
Microsoft Entra id. especifica la configuración de la biblioteca Microsoft.Identity.Web. En Centro de administración de Microsoft Entra, seleccione Aplicaciones en el menú del portal y, a continuación, 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 Entra admin center. Select 'Endpoints' from the 'App registrations' blade and use the GUID in any of the URLs), e.g. aaaabbbb-0000-cccc-1111-dddd2222eeee]",
"ClientId": "[Enter the Client Id (Application ID obtained from the Microsoft Entra admin center), e.g. 00001111-aaaa-2222-bbbb-3333cccc4444]",
"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": "*"
}
Index.cshtml.cs
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.
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 ya ha terminado con este tutorial y no necesita la aplicación web ni los recursos asociados, elimine los recursos que creó.