إشعار
يتطلب الوصول إلى هذه الصفحة تخويلاً. يمكنك محاولة تسجيل الدخول أو تغيير الدلائل.
يتطلب الوصول إلى هذه الصفحة تخويلاً. يمكنك محاولة تغيير الدلائل.
تعلم كيفية الوصول إلى Microsoft Graph من تطبيق ويب يعمل على Azure App Service.
تريد إضافة وصول إلى Microsoft Graph من تطبيق الويب الخاص بك والقيام ببعض الإجراءات كمستخدم مسجل. يشرح هذا القسم كيفية منح الأذونات المفوضة لتطبيق الويب والحصول على معلومات ملف المستخدم المسجلة من Microsoft Entra ID.
في هذا البرنامج التعليمي، تتعلم كيفية:
- منح أذونات مفوضة إلى تطبيق ويب.
- اتصل ب Microsoft Graph من تطبيق ويب لمستخدم مسجل.
إذا لم يكن لديك حساب Azure، أنشئ حسابا مجاني قبل أن تبدأ.
المتطلبات الأساسية
- تطبيق ويب يعمل على Azure App Service يحتوي على وحدة المصادقة/التفويض App Service.
امنح الوصول إلى الواجهة الأمامية لاستدعاء Microsoft Graph
بعد تمكين المصادقة والتفويض على تطبيق الويب الخاص بك، يتم تسجيل تطبيق الويب في منصة Microsoft Identity ويدعم بتطبيق Microsoft Entra. في هذه الخطوة، تمنح تطبيق الويب صلاحيات للوصول إلى Microsoft Graph للمستخدم.
ملحوظة
تقنيا، تمنح تطبيق Microsoft Entra الخاص بتطبيق الويب الأذونات للوصول إلى تطبيق Microsoft Graph Microsoft Entra الخاص بالمستخدم.
في Microsoft Entra admin center، اختر Entra ID.
اختر App registrations>Owned applications>عرض جميع التطبيقات في هذا الدليل. حدد اسم تطبيق الويب، ثم حدد أذونات واجهة برمجة التطبيقات.
اختر إضافة إذن، ثم اختر واجهات برمجة تطبيقات مايكروسوفت، ثم Microsoft Graph.
حدد الأذونات المفوضة، ثم حدد User.Read من القائمة. حدد إضافة أذونات.
تكوين خدمة التطبيقات لإرجاع رمز مميز للوصول قابل للاستخدام
أصبح تطبيق الويب الآن لديه الأذونات المطلوبة للوصول إلى Microsoft Graph كمستخدم مسجل. في هذا القسم، تقوم بتكوين مصادقة وتفويض خدمة التطبيقات لمنحك رمز وصول قابل للاستخدام للوصول إلى Microsoft Graph. لهذه الخطوة، تحتاج إلى إضافة نطاق User.Read الخدمة اللاحقة (Microsoft Graph): https://graph.microsoft.com/User.Read.
هام
إذا لم تقم بتكوين App Service لإعادة رمز وصول قابل للاستخدام، ستحصل على خطأ CompactToken parsing failed with error code: 80049217 عند استدعاء واجهات برمجة التطبيقات Microsoft Graph في الكود الخاص بك.
- Azure مستكشف الموارد
- واجهة سطر الأوامر Azure (Azure CLI)
اذهب إلى Azure Resource Explorer وباستخدام شجرة الموارد، ابحث عن تطبيق الويب الخاص بك. يجب أن يكون رابط المورد مشابها ل https://management.azure.com/subscriptions/subscriptionId/resourceGroups/SecureWebApp/providers/Microsoft.Web/sites/SecureWebApp20200915115914.
يتم الآن فتح Azure Resource Explorer مع اختيار تطبيق الويب الخاص بك في شجرة الموارد.
في أعلى الصفحة، اختر Edit لتمكين تحرير موارد Azure الخاصة بك.
في المستعرض الأيسر، انتقل لأسفل لتكوين >authsettingsV2.
في طريقة العرض authsettingsV2 ، حدد Edit.
ابحث عن قسم تسجيل الدخول في idProviders>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;
}
تنظيف الموارد
إذا أكملت جميع الخطوات في هذا البرنامج التعليمي متعدد الأحزاب، فقد أنشأت App Service وخطة استضافة App Service وحساب تخزين في مجموعة موارد. كما أنشأت تسجيل تطبيق في Microsoft Entra ID. إذا اخترت التكوين الخارجي، ربما أنشأت مستأجرا خارجيا جديدا. عند عدم الحاجة إلى ذلك، احذف هذه الموارد وتسجيل التطبيق حتى لا تستمر في تحصيل الرسوم.
في هذا البرنامج التعليمي، تتعلم كيفية:
- احذف موارد Azure التي تم إنشاؤها أثناء اتباع الشرح.
لا تحذف مجموعة الموارد
في بوابة Azure، من قائمة بوابة Azure، اختر مجموعات الموارد.
اختر مجموعة الموارد التي تحتوي على خدمة التطبيق وخطة خدمة التطبيق.
حدد حذف مجموعة الموارد لحذف مجموعة الموارد وجميع الموارد.
قد يستغرق هذا الإجراء عدة دقائق.
حذف تسجيل التطبيق
في Microsoft Entra admin center، اختر App registrations. ثم حدد التطبيق الذي قمت بإنشائه.
في نظرة عامة على تسجيل التطبيق، حدد حذف.
حذف المستأجر الخارجي
إذا قمت بإنشاء مستأجر خارجي جديد، يمكنك حذفه.
في مركز إدارة Microsoft Entra، تصفح إلىنظرة عامة>على Entra ID>إدارة المستأجرين.
حدد المستأجر الذي تريد حذفه، ثم حدد حذف.
قد تحتاج إلى إكمال الإجراءات المطلوبة قبل أن تتمكن من حذف المستأجر. على سبيل المثال، قد تحتاج إلى حذف جميع تدفقات المستخدم وتسجيلات التطبيق في المستأجر.
إذا كنت جاهزا لحذف المستأجر، فحدد حذف.
الخطوات التالية
في هذا البرنامج التعليمي، نتعلم طريقة القيام بما يأتي:
- منح أذونات مفوضة إلى تطبيق ويب.
- اتصل ب Microsoft Graph من تطبيق ويب لمستخدم مسجل.