Учебник. Доступ к Microsoft Graph из защищенного приложения JavaScript от имени пользователя
Узнайте, как получить доступ к Microsoft Graph из веб-приложения, работающего в Службе приложений Azure.
Предположим, вам нужно обращаться из веб-приложения к Microsoft Graph и выполнять какие-либо действия от имени пользователя, выполнившего вход. В этом разделе описывается, как предоставить делегированные разрешения веб-приложению и получить сведения о профиле пользователя, выполнившего вход, из идентификатора Microsoft Entra.
В этом руководстве описано следующее:
- предоставить веб-приложению делегированные разрешения;
- вызвать Microsoft Graph из веб-приложения для пользователя, выполнившего вход.
Если у вас еще нет подписки Azure, создайте бесплатную учетную запись Azure, прежде чем начинать работу.
Необходимые компоненты
- Веб-приложение, выполняющееся в Службе приложений Azure, с включенным модулем проверки подлинности или авторизации Службы приложений.
Предоставление доступа к интерфейсу для вызова Microsoft Graph
Теперь, когда вы включили проверку подлинности и авторизацию в веб-приложении, веб-приложение регистрируется в платформа удостоверений Майкрософт и поддерживается приложением Microsoft Entra. На этом шаге вы предоставите веб-приложению разрешения для доступа к Microsoft Graph для пользователя. (Технически вы предоставляете приложению Microsoft Entra веб-приложения разрешения на доступ к приложению Microsoft Graph Microsoft Entra для пользователя.)
В Центре администрирования Microsoft Entra выберите "Приложения".
Поочередно выберите Регистрация приложений>Собственные приложения>View all applications in this directory (Просмотреть все приложения в этом каталоге). Щелкните имя веб-приложения и выберите Разрешения API.
Щелкните Добавить разрешения, а затем выберите API-интерфейсы Майкрософт, а также Microsoft Graph.
Щелкните Делегированные разрешения, а затем выберите из списка User.Read. Выберите Добавить разрешения.
Настройка службы приложений для возвращения используемых маркеров доступа
Теперь у веб-приложения есть необходимые разрешения для доступа к Microsoft Graph от имени вошедшего в систему пользователя. На этом шаге настройте проверку подлинности и авторизацию в Службе приложений, чтобы получить пригодный к использованию маркер доступа для обращения к Microsoft Graph. На этом шаге вам понадобится добавить область User.Read для подчиненной службы (Microsoft Graph): https://graph.microsoft.com/User.Read.
Важно!
Если вы не настроите в Службе приложений возврат пригодного к использованию маркера доступа, при вызове API Microsoft Graph из кода возникнет ошибка CompactToken parsing failed with error code: 80049217.
Перейдите к обозревателю ресурсов Azure и с помощью дерева ресурсов найдите нужное веб-приложение. URL-адрес ресурса должен выглядеть приблизительно так: https://resources.azure.com/subscriptions/subscriptionId/resourceGroups/SecureWebApp/providers/Microsoft.Web/sites/SecureWebApp20200915115914.
Теперь откроется обозреватель ресурсов Azure с представлением дерева ресурсов, в котором выделено это веб-приложение.
В верхней части страницы выберите Чтение и запись, чтобы внести изменения в обозревателе ресурсов Azure.
В браузере слева перейдите к разделу config>authsettingsV2.
В представлении authsettingsV2 выберите Изменить.
Найдите раздел login в identityProviders ->azureActiveDirectory и добавьте следующие параметры 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" ] } } } },Сохраните настройки, выбрав PUT. Эти настройки могут вступить в силу через несколько минут. Теперь веб-приложение настроено для доступа к Microsoft Graph с использованием правильного маркера доступа. В противном случае Microsoft Graph вернет ошибку с сообщением о неправильном формате компактного маркера.
Вызов Microsoft Graph из Node.js
Теперь веб-приложение имеет требуемые разрешения и правильно включает идентификатор клиента Microsoft Graph в параметры входа.
Просмотреть этот код как часть примера приложения можно здесь:
Установка пакетов клиентских библиотек
Установите пакеты @azure/identity и @microsoft/microsoft-graph-client в проекте с npm.
npm install @microsoft/microsoft-graph-client
Предоставление сведений о проверке подлинности
Создайте объект для хранения параметров проверки подлинности:
// 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
},
},
}
Вызов Microsoft Graph от имени пользователя
В следующем коде показано, как вызвать контроллер Microsoft Graph от имени приложения и получить сведения о пользователе.
// 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);
}
}
Предыдущий код использует следующую функцию getAuthenticatedClient для возврата клиента 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;
}
Очистка ресурсов
Если вы выполнили все шаги из этого учебника, состоящего из нескольких частей, то уже создали службу приложений, план размещения службы приложений и учетную запись хранения в группе ресурсов. Вы также создали регистрацию приложения в идентификаторе Microsoft Entra. Если ресурсы и регистрация приложения больше не нужны, удалите их, чтобы за них не взималась плата.
В этом руководстве описано следующее:
- удалять ресурсы Azure, созданные при работе с этим учебником.
Удаление группы ресурсов
В меню портала Azure щелкните Группы ресурсов и выберите группу ресурсов, содержащую службу приложений и план службы приложений.
Щелкните Удалить группу ресурсов. Одновременно с группой ресурсов удаляются все содержащиеся в ней ресурсы.
Выполнение этой команды может занять несколько минут.
Удаление регистрации приложения
В Центре администрирования Microsoft Entra выберите "Приложения> Регистрация приложений". Затем выберите созданное вами приложение.
В разделе общих сведений регистрации приложения выберите Удалить.
Следующие шаги
Из этого руководства вы узнали, как:
- предоставить веб-приложению делегированные разрешения;
- вызвать Microsoft Graph из веб-приложения для пользователя, выполнившего вход.