Samouczek: uzyskiwanie dostępu do programu Microsoft Graph z zabezpieczonej aplikacji JavaScript jako użytkownika
Dowiedz się, jak uzyskać dostęp do programu Microsoft Graph z poziomu aplikacji internetowej działającej w usłudze aplikacja systemu Azure Service.
Chcesz dodać dostęp do programu Microsoft Graph z aplikacji internetowej i wykonać jakąś akcję jako zalogowany użytkownik. W tej sekcji opisano sposób udzielania delegowanych uprawnień do aplikacji internetowej i uzyskiwania informacji o profilu zalogowanego użytkownika z identyfikatora Entra firmy Microsoft.
Z tego samouczka dowiesz się, jak wykonywać następujące czynności:
- Przyznawanie delegowanych uprawnień do aplikacji internetowej.
- Wywołaj program Microsoft Graph z aplikacji internetowej dla zalogowanego użytkownika.
Jeśli nie masz subskrypcji platformy Azure, przed rozpoczęciem utwórz bezpłatne konto platformy Azure.
Wymagania wstępne
- Aplikacja internetowa działająca w usłudze aplikacja systemu Azure z włączonym modułem uwierzytelniania/autoryzacji usługi App Service.
Udzielanie dostępu frontonu w celu wywołania programu Microsoft Graph
Po włączeniu uwierzytelniania i autoryzacji w aplikacji internetowej aplikacja internetowa jest zarejestrowana w Platforma tożsamości Microsoft i jest wspierana przez aplikację Firmy Microsoft Entra. W tym kroku przyznasz aplikacji internetowej uprawnienia dostępu do programu Microsoft Graph dla użytkownika. (Technicznie należy przyznać aplikacji internetowej Microsoft Entra uprawnienia dostępu do aplikacji Microsoft Entra programu Microsoft Graph dla użytkownika).
W centrum administracyjnym firmy Microsoft Entra wybierz pozycję Aplikacje.
Wybierz pozycję Rejestracje aplikacji> Owned aplikacje>Wyświetl wszystkie aplikacje w tym katalogu. Wybierz nazwę aplikacji internetowej, a następnie wybierz pozycję Uprawnienia interfejsu API.
Wybierz pozycję Dodaj uprawnienie, a następnie wybierz pozycję Interfejsy API firmy Microsoft i program Microsoft Graph.
Wybierz pozycję Delegowane uprawnienia, a następnie wybierz pozycję User.Read z listy. Wybierz Przyznaj uprawnienia.
Konfigurowanie usługi App Service do zwracania nadającego się do użycia tokenu dostępu
Aplikacja internetowa ma teraz wymagane uprawnienia dostępu do programu Microsoft Graph jako zalogowany użytkownik. W tym kroku skonfigurujesz uwierzytelnianie i autoryzację usługi App Service w celu udzielenia użytecznego tokenu dostępu do uzyskiwania dostępu do programu Microsoft Graph. W tym kroku należy dodać zakres User.Read dla usługi podrzędnej (Microsoft Graph): https://graph.microsoft.com/User.Read.
Ważne
Jeśli nie skonfigurujesz usługi App Service w celu zwrócenia użytecznego tokenu dostępu, podczas wywoływania interfejsów API programu Microsoft Graph w kodzie wystąpi CompactToken parsing failed with error code: 80049217 błąd.
Przejdź do Eksploratora zasobów platformy Azure i użyj drzewa zasobów, znajdź aplikację internetową. Adres URL zasobu powinien być podobny do https://resources.azure.com/subscriptions/subscriptionId/resourceGroups/SecureWebApp/providers/Microsoft.Web/sites/SecureWebApp20200915115914.
Eksplorator zasobów platformy Azure jest teraz otwierany przy użyciu aplikacji internetowej wybranej w drzewie zasobów.
W górnej części strony wybierz pozycję Odczyt/Zapis , aby włączyć edytowanie zasobów platformy Azure.
W lewej przeglądarce przejdź do szczegółów konfiguracji>authsettingsV2.
W widoku authsettingsV2 wybierz pozycję Edytuj.
Znajdź sekcję logowania identityProviders ->azureActiveDirectory i dodaj następujące ustawienia 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" ] } } } },Zapisz ustawienia, wybierając pozycję PUT. Zastosowanie tego ustawienia może potrwać kilka minut. Aplikacja internetowa jest teraz skonfigurowana do uzyskiwania dostępu do programu Microsoft Graph przy użyciu odpowiedniego tokenu dostępu. Jeśli tego nie zrobisz, program Microsoft Graph zwróci błąd z informacją, że format tokenu kompaktowego jest niepoprawny.
Wywoływanie programu Microsoft Graph z pliku Node.js
Aplikacja internetowa ma teraz wymagane uprawnienia, a także dodaje identyfikator klienta programu Microsoft Graph do parametrów logowania.
Aby zobaczyć ten kod w ramach przykładowej aplikacji, zobacz:
Instalowanie pakietów bibliotek klienta
Zainstaluj @azure/tożsamość i pakiety @microsoft/microsoft-graph-client w projekcie za pomocą narzędzia npm.
npm install @microsoft/microsoft-graph-client
Konfigurowanie informacji o uwierzytelnianiu
Utwórz obiekt do przechowywania ustawień uwierzytelniania:
// partial code in app.js
const appSettings = {
appCredentials: {
clientId: process.env.WEBSITE_AUTH_CLIENT_ID, // Enter the client Id here,
tenantId: "common", // Enter the tenant info here,
clientSecret: process.env.MICROSOFT_PROVIDER_AUTHENTICATION_SECRET // Enter the client secret here,
},
authRoutes: {
redirect: "/.auth/login/aad/callback", // Enter the redirect URI here
error: "/error", // enter the relative path to error handling route
unauthorized: "/unauthorized" // enter the relative path to unauthorized route
},
protectedResources: {
graphAPI: {
endpoint: "https://graph.microsoft.com/v1.0/me", // resource endpoint
scopes: ["User.Read"] // resource scopes
},
},
}
Wywoływanie programu Microsoft Graph w imieniu użytkownika
Poniższy kod pokazuje, jak wywołać kontroler programu Microsoft Graph jako aplikację i uzyskać informacje o użytkowniku.
// controllers/graphController.js
// get the name of the app service instance from environment variables
const appServiceName = process.env.WEBSITE_SITE_NAME;
const graphHelper = require('../utils/graphHelper');
exports.getProfilePage = async(req, res, next) => {
try {
// get user's access token scoped to Microsoft Graph from session
// use token to create Graph client
const graphClient = graphHelper.getAuthenticatedClient(req.session.protectedResources["graphAPI"].accessToken);
// return user's profile
const profile = await graphClient
.api('/me')
.get();
res.render('profile', { isAuthenticated: req.session.isAuthenticated, profile: profile, appServiceName: appServiceName });
} catch (error) {
next(error);
}
}
Poprzedni kod opiera się na następującej funkcji getAuthenticatedClient w celu zwrócenia klienta programu Microsoft Graph.
// utils/graphHelper.js
const graph = require('@microsoft/microsoft-graph-client');
getAuthenticatedClient = (accessToken) => {
// Initialize Graph client
const client = graph.Client.init({
// Use the provided access token to authenticate requests
authProvider: (done) => {
done(null, accessToken);
}
});
return client;
}
Czyszczenie zasobów
Jeśli wszystkie kroki opisane w tym samouczku wieloczęściowym zostały wykonane, utworzono usługę App Service, plan hostingu usługi App Service i konto magazynu w grupie zasobów. Utworzono również rejestrację aplikacji w identyfikatorze Entra firmy Microsoft. Gdy te zasoby i rejestracja aplikacji nie będą już potrzebne, usuń je, aby nie były naliczane opłaty.
Z tego samouczka dowiesz się, jak wykonywać następujące czynności:
- Usuń zasoby platformy Azure utworzone podczas wykonywania kroków samouczka.
Usuwanie grupy zasobów
W witrynie Azure Portal wybierz pozycję Grupy zasobów z menu portalu i wybierz grupę zasobów zawierającą usługę App Service i plan usługi App Service.
Wybierz pozycję Usuń grupę zasobów, aby usunąć grupę zasobów i wszystkie zasoby.
Uruchomienie tego polecenia może potrwać kilka minut.
Usuwanie rejestracji aplikacji
W centrum administracyjnym firmy Microsoft Entra wybierz pozycję Aplikacje> Rejestracje aplikacji. Następnie wybierz utworzoną aplikację.
W przeglądzie rejestracji aplikacji wybierz pozycję Usuń.
Następne kroki
W tym samouczku zawarto informacje na temat wykonywania następujących czynności:
- Przyznawanie delegowanych uprawnień do aplikacji internetowej.
- Wywołaj program Microsoft Graph z aplikacji internetowej dla zalogowanego użytkownika.