Erstellen von JavaScript-Apps mit Microsoft Graph
In diesem Lernprogramm erfahren Sie, wie Sie eine JavaScript-Konsolen-App erstellen, die die Microsoft Graph-API verwendet.
Tipp
Wenn Sie nur das abgeschlossene Lernprogramm herunterladen möchten, können Sie das GitHub-Repository herunterladen oder klonen.
Voraussetzungen
Bevor Sie mit diesem Lernprogramm beginnen, sollten Sie die Node.js auf Ihrem Entwicklungscomputer installiert haben.
Außerdem sollten Sie entweder über ein persönliches Microsoft-Konto mit einem Postfach auf Outlook.com oder über ein Microsoft-Geschäfts-, Schul- oder Unikonto verfügen. Wenn Sie nicht über ein Microsoft-Konto verfügen, gibt es eine Reihe von Optionen, um ein kostenloses Konto zu erhalten:
- Sie können sich für ein neues persönliches Microsoft-Konto registrieren.
- Sie können sich für das Microsoft 365-Entwicklerprogramm registrieren, um ein kostenloses Microsoft 365-Abonnement zu erhalten.
Hinweis
Dieses Lernprogramm wurde mit Node.js Version 16.14.2 geschrieben. Die Schritte in diesem Handbuch funktionieren möglicherweise mit anderen Versionen, die jedoch nicht getestet wurden.
Registrieren der App im Portal
In dieser Übung registrieren Sie eine neue Anwendung in Azure Active Directory, um die Benutzerauthentifizierung zu aktivieren. Sie können eine Anwendung über das Azure Active Directory Admin Center oder über das Microsoft Graph PowerShell SDK registrieren.
Registrieren der Anwendung für die Benutzerauthentifizierung
In diesem Abschnitt registrieren Sie eine Anwendung, die die Benutzerauthentifizierung mithilfe des Gerätecodeflusses unterstützt.
Öffnen Sie einen Browser, und navigieren Sie zum Azure Active Directory Admin Center. Melden Sie sich mit einem persönlichen Konto (auch: Microsoft-Konto) oder einem Geschäfts- oder Schulkonto an.
Wählen Sie in der linken Navigationsleiste Azure Active Directory aus, und wählen Sie dann App-Registrierungen unter Verwalten aus.
Wählen Sie Neue Registrierung aus. Geben Sie einen Namen für Ihre Anwendung ein,
JavaScript Graph Tutorialz. B. .Legen Sie unterstützte Kontotypen wie gewünscht fest. Mögliche Optionen:
Option Wer können sich anmelden? Nur Konten in diesem Organisationsverzeichnis Nur Benutzer in Ihrer Microsoft 365 Organisation Konten in einem beliebigen Organisationsverzeichnis Benutzer in einer beliebigen Microsoft 365 Organisation (Geschäfts-, Schul- oder Unikonten) Konten in einem beliebigen Organisationsverzeichnis ... und persönlichen Microsoft-Konten Benutzer in einer beliebigen Microsoft 365 Organisation (Geschäfts-, Schul- oder Unikonten) und persönlichen Microsoft-Konten Lassen Sie URI umleiten leer.
Wählen Sie Registrieren aus. Kopieren Sie auf der Seite "Übersicht " der Anwendung den Wert der Anwendungs-ID (Client-ID), und speichern Sie ihn. Sie benötigen ihn im nächsten Schritt. Wenn Sie "Konten" in diesem Organisationsverzeichnis nur für unterstützte Kontotypen ausgewählt haben, kopieren Sie auch die Verzeichnis-ID (Mandanten-ID), und speichern Sie sie.
Wählen Sie unter Verwalten die Option Authentifizierung aus. Suchen Sie den Abschnitt "Erweiterte Einstellungen" , und ändern Sie den Umschalter " Öffentliche Clientflüsse zulassen " in "Ja", und wählen Sie dann "Speichern" aus.
Hinweis
Beachten Sie, dass Sie keine Microsoft Graph-Berechtigungen für die App-Registrierung konfiguriert haben. Dies liegt daran, dass im Beispiel die dynamische Zustimmung verwendet wird, um bestimmte Berechtigungen für die Benutzerauthentifizierung anzufordern.
Erstellen einer JavaScript-Konsolen-App
Erstellen Sie zunächst ein neues Node.js-Projekt. Öffnen Sie die Befehlszeilenschnittstelle (CLI) in einem Verzeichnis, in dem Sie das Projekt erstellen möchten. Führen Sie den folgenden Befehl aus.
npm init
Beantworten Sie die Eingabeaufforderungen, indem Sie entweder Ihre eigenen Werte angeben oder die Standardwerte akzeptieren.
Installieren von Abhängigkeiten
Fügen Sie vor dem Fortfahren einige zusätzliche Abhängigkeiten hinzu, die Sie später verwenden werden.
- Azure Identity-Clientbibliothek für JavaScript zum Authentifizieren des Benutzers und Abrufen von Zugriffstoken.
- Microsoft Graph JavaScript-Clientbibliothek, um Aufrufe an die Microsoft Graph zu senden.
- isomorphic-fetch zum Hinzufügen
fetcheiner API zu Node.js. Dies ist eine Abhängigkeit für die Microsoft Graph JavaScript-Clientbibliothek. - readline-sync , um den Benutzer zur Eingabe aufzufordern.
Führen Sie die folgenden Befehle in Ihrer CLI aus, um die Abhängigkeiten zu installieren.
npm install @azure/identity @microsoft/microsoft-graph-client isomorphic-fetch readline-sync
Laden von Anwendungseinstellungen
In diesem Abschnitt fügen Sie dem Projekt die Details ihrer App-Registrierung hinzu.
Erstellen Sie eine Datei im Stammverzeichnis des Projekts mit dem Namen appSettings.js , und fügen Sie den folgenden Code hinzu.
Aktualisieren Sie die Werte gemäß
settingsder folgenden Tabelle.Einstellung Wert clientIdDie Client-ID Ihrer App-Registrierung authTenantWenn Sie die Option ausgewählt haben, dass sich nur Benutzer in Ihrer Organisation anmelden können, ändern Sie diesen Wert in Ihre Mandanten-ID. Andernfalls belassen als common.
Entwerfen der App
In diesem Abschnitt erstellen Sie ein einfaches konsolenbasiertes Menü.
Erstellen Sie eine Datei im Stammverzeichnis des Projekts mit dem Namen graphHelper.js , und fügen Sie den folgenden Platzhaltercode hinzu. Sie fügen in späteren Schritten weiteren Code zu dieser Datei hinzu.
module.exports = {};Erstellen Sie eine Datei im Stammverzeichnis des Projekts mit dem Namen index.js , und fügen Sie den folgenden Code hinzu.
Fügen Sie die folgenden Platzhaltermethoden am Ende der Datei hinzu. Sie implementieren sie in späteren Schritten.
function initializeGraph(settings) { // TODO } async function greetUserAsync() { // TODO } async function displayAccessTokenAsync() { // TODO } async function listInboxAsync() { // TODO } async function sendMailAsync() { // TODO } async function listUsersAsync() { // TODO } async function makeGraphCallAsync() { // TODO }
Dadurch wird ein einfaches Menü implementiert und die Auswahl des Benutzers über die Befehlszeile gelesen.
Hinzufügen der Benutzerauthentifizierung
In diesem Abschnitt erweitern Sie die Anwendung aus der vorherigen Übung, um die Authentifizierung mit Azure AD zu unterstützen. Dies ist erforderlich, um das erforderliche OAuth-Zugriffstoken zum Aufrufen der Microsoft Graph abzurufen. In diesem Schritt integrieren Sie die Azure Identity-Clientbibliothek für JavaScript in die Anwendung und konfigurieren die Authentifizierung für die Microsoft Graph JavaScript-Clientbibliothek.
Die Azure Identity-Bibliothek stellt eine Reihe von TokenCredential Klassen bereit, die OAuth2-Tokenflüsse implementieren. Die Microsoft Graph-Clientbibliothek verwendet diese Klassen, um Aufrufe von Microsoft Graph zu authentifizieren. In diesem Beispiel verwenden wir die folgenden TokenCredential Klassen.
DeviceCodeCredentialimplementiert den Gerätecodefluss für die Benutzerauthentifizierung.ClientSecretCredentialimplementiert den Clientanmeldeinformationsfluss für die Nur-App-Authentifizierung. Sie verwenden diese Klasse in den optionalen Nur-App-Abschnitten.
Konfigurieren Graph Clients für die Benutzerauthentifizierung
In diesem Abschnitt verwenden Sie die DeviceCodeCredential Klasse, um ein Zugriffstoken mithilfe des Gerätecodeflusses anzufordern.
Erstellen Sie eine neue Datei im Stammverzeichnis des Projekts mit dem Namen graphHelper.js , und fügen Sie dieser Datei den folgenden Code hinzu.
Ersetzen Sie die leere
initializeGraphFunktion in index.js durch Folgendes.
Dieser Code deklariert zwei private Eigenschaften, ein DeviceCodeCredential Objekt und ein Client Objekt. Die initializeGraphForUserAuth Funktion erstellt eine neue Instanz von DeviceCodeCredentialund verwendet dann diese Instanz, um eine neue Instanz von Clientzu erstellen. Jedes Mal, wenn ein API-Aufruf an Microsoft Graph durch den _userClienterfolgt, verwendet er die bereitgestellten Anmeldeinformationen, um ein Zugriffstoken abzurufen.
Testen von DeviceCodeCredential
Fügen Sie als Nächstes Code hinzu, um ein Zugriffstoken vom DeviceCodeCredential.
Fügen SiegraphHelper.jsdie folgende Funktion hinzu.
Ersetzen Sie die leere
displayAccessTokenAsyncFunktion in index.js durch Folgendes.Führen Sie den folgenden Befehl in Ihrer CLI im Stammverzeichnis des Projekts aus.
node index.jsGeben Sie
1die Eingabetaste ein, wenn Sie zur Eingabe einer Option aufgefordert werden. Die Anwendung zeigt eine URL und einen Gerätecode an.JavaScript Graph Tutorial [1] Display access token [2] List my inbox [3] Send mail [4] List users (requires app-only) [5] Make a Graph call [0] Exit Select an option [1...5 / 0]: 1 To sign in, use a web browser to open the page https://microsoft.com/devicelogin and enter the code RK987NX32 to authenticate.Öffnen Sie einen Browser, und navigieren Sie zu der angezeigten URL. Geben Sie den bereitgestellten Code ein, und melden Sie sich an.
Wichtig
Achten Sie auf alle vorhandenen Microsoft 365-Konten, die beim Surfen
https://microsoft.com/deviceloginin Ihrem Browser angemeldet sind. Verwenden Sie Browserfeatures wie Profile, Gastmodus oder privaten Modus, um sicherzustellen, dass Sie sich als das Konto authentifizieren, das Sie zum Testen verwenden möchten.Kehren Sie nach Abschluss der Anwendung zurück, um das Zugriffstoken anzuzeigen.
Tipp
Nur zu Überprüfungs- und Debugzwecken können Sie Benutzerzugriffstoken (nur für Geschäfts-, Schul- oder Unikonten) mithilfe des Onlinetokenparsers von Microsoft unter https://jwt.msdecodieren. Dies kann hilfreich sein, wenn beim Aufrufen von Microsoft Graph Tokenfehler auftreten. Überprüfen Sie beispielsweise, ob der
scpAnspruch im Token die erwarteten Microsoft Graph Berechtigungsbereiche enthält.
Benutzer abrufen
In diesem Abschnitt integrieren Sie die Microsoft Graph in die Anwendung. Sie verwenden die Microsoft Graph JavaScript-Clientbibliothek, um Aufrufe an Microsoft Graph zu senden.
Öffnen SiegraphHelper.js , und fügen Sie die folgende Funktion hinzu.
Ersetzen Sie die leere
greetUserAsyncFunktion in index.js durch Folgendes.
Wenn Sie die App jetzt ausführen, werden Sie nach der Anmeldung in der App mit dem Namen begrüßt.
Hello, Megan Bowen!
Email: MeganB@contoso.com
Code erklärt
Betrachten Sie den Code in der getUserAsync Funktion. Es sind nur ein paar Zeilen, aber es gibt einige wichtige Details zu beachten.
Zugreifen auf "Ich"
Die Funktion wird an den Anforderungs-Generator _userClient.api übergeben/me, der eine Anforderung an die Benutzer-API abrufen erstellt. Auf diese API kann auf zwei Arten zugegriffen werden:
GET /me
GET /users/{user-id}
In diesem Fall ruft der Code den GET /me API-Endpunkt auf. Dies ist eine Verknüpfungsmethode zum Abrufen des authentifizierten Benutzers, ohne dessen Benutzer-ID zu kennen.
Hinweis
Da der GET /me API-Endpunkt den authentifizierten Benutzer abruft, ist er nur für Apps verfügbar, die die Benutzerauthentifizierung verwenden. Nur-App-Authentifizierungs-Apps können nicht auf diesen Endpunkt zugreifen.
Anfordern bestimmter Eigenschaften
Die Funktion verwendet die select Methode für die Anforderung, um den satz der benötigten Eigenschaften anzugeben. Dadurch wird dem API-Aufruf der $select Abfrageparameter hinzugefügt.
Stark typisierter Rückgabetyp
Die Funktion gibt ein User Objekt zurück, das aus der JSON-Antwort der API deserialisiert wurde. Da der Code verwendet select, haben nur die angeforderten Eigenschaften Werte im zurückgegebenen User Objekt. Alle anderen Eigenschaften haben Standardwerte.
Posteingang auflisten
In diesem Abschnitt fügen Sie die Möglichkeit hinzu, Nachrichten im E-Mail-Posteingang des Benutzers auflisten zu können.
Öffnen SiegraphHelper.js , und fügen Sie die folgende Funktion hinzu.
Ersetzen Sie die leere
ListInboxAsyncFunktion in index.js durch Folgendes.Führen Sie die App aus, melden Sie sich an, und wählen Sie Option 2 aus, um Ihren Posteingang auflisten.
[1] Display access token [2] List my inbox [3] Send mail [4] List users (requires app-only) [5] Make a Graph call [0] Exit Select an option [1...5 / 0]: 2 Message: Updates from Ask HR and other communities From: Contoso Demo on Yammer Status: Read Received: 12/30/2021 4:54:54 AM -05:00 Message: Employee Initiative Thoughts From: Patti Fernandez Status: Read Received: 12/28/2021 5:01:10 PM -05:00 Message: Voice Mail (11 seconds) From: Alex Wilber Status: Unread Received: 12/28/2021 5:00:46 PM -05:00 Message: Our Spring Blog Update From: Alex Wilber Status: Unread Received: 12/28/2021 4:49:46 PM -05:00 Message: Atlanta Flight Reservation From: Alex Wilber Status: Unread Received: 12/28/2021 4:35:42 PM -05:00 Message: Atlanta Trip Itinerary - down time From: Alex Wilber Status: Unread Received: 12/28/2021 4:22:04 PM -05:00 ... More messages available? true
Code erklärt
Betrachten Sie den Code in der getInboxAsync Funktion.
Zugreifen auf bekannte E-Mail-Ordner
Die Funktion wird an den Anforderungs-Generator _userClient.api übergeben/me/mailFolders/inbox/messages, der eine Anforderung an die Api für Listennachrichten erstellt. Da sie den /mailFolders/inbox Teil des API-Endpunkts enthält, gibt die API nur Nachrichten im angeforderten E-Mail-Ordner zurück. Da der Posteingang in diesem Fall ein standardmäßiger, bekannter Ordner innerhalb des Postfachs eines Benutzers ist, kann über seinen bekannten Namen darauf zugegriffen werden. Auf nicht standardmäßige Ordner wird auf die gleiche Weise zugegriffen, indem der bekannte Name durch die ID-Eigenschaft des E-Mail-Ordners ersetzt wird. Ausführliche Informationen zu den verfügbaren bekannten Ordnernamen finden Sie unter mailFolder-Ressourcentyp.
Zugreifen auf eine Sammlung
getUserAsync Im Gegensatz zur Funktion aus dem vorherigen Abschnitt, die ein einzelnes Objekt zurückgibt, gibt diese Methode eine Auflistung von Nachrichten zurück. Die meisten APIs in Microsoft Graph, die eine Sammlung zurückgeben, geben nicht alle verfügbaren Ergebnisse in einer einzigen Antwort zurück. Stattdessen verwenden sie Paging , um einen Teil der Ergebnisse zurückzugeben, während sie eine Methode für Clients bereitstellen, um die nächste "Seite" anzufordern.
Standardseitengrößen
APIs, die Paging verwenden, implementieren ein Standardseitenformat. Bei Nachrichten ist der Standardwert 10. Clients können mehr (oder weniger) mithilfe des $top Abfrageparameters anfordern. In getInboxAsyncwird dies mit der .top(25) Methode erreicht.
Hinweis
Der übergebene .top() Wert ist eine obere Grenze, keine explizite Zahl. Die API gibt eine Reihe von Nachrichten bis zum angegebenen Wert zurück.
Abrufen nachfolgender Seiten
Wenn auf dem Server weitere Ergebnisse verfügbar sind, enthalten sammlungsantworten eine @odata.nextLink Eigenschaft mit einer API-URL, um auf die nächste Seite zuzugreifen. Die Java-Clientbibliothek macht diese Eigenschaft für PageCollection Objekte verfügbar. Wenn diese Eigenschaft nicht undefiniert ist, sind weitere Ergebnisse verfügbar.
Der Wert von @odata.nextLink kann übergeben werden, um die nächste Seite mit Ergebnissen abzurufen _userClient.api . Alternativ können Sie das Objekt aus der PageIterator Clientbibliothek verwenden, um alle verfügbaren Seiten zu durchlaufen.
Sortieren von Sammlungen
Die Funktion verwendet die orderby Methode für die Anforderung, um Ergebnisse sortiert nach dem Zeitpunkt des Empfangs der Nachricht anzufordern (receivedDateTime Eigenschaft). Es enthält das DESC Schlüsselwort, sodass kürzlich empfangene Nachrichten zuerst aufgeführt werden. Dadurch wird dem API-Aufruf der $orderby Abfrageparameter hinzugefügt.
Nachrichten senden
In diesem Abschnitt fügen Sie die Möglichkeit hinzu, eine E-Mail-Nachricht als authentifizierter Benutzer zu senden.
Öffnen SiegraphHelper.js , und fügen Sie die folgende Funktion hinzu.
Ersetzen Sie die leere
sendMailAsyncFunktion in index.js durch Folgendes.Führen Sie die App aus, melden Sie sich an, und wählen Sie Option 3 aus, um eine E-Mail an sich selbst zu senden.
[1] Display access token [2] List my inbox [3] Send mail [4] List users (requires app-only) [5] Make a Graph call [0] Exit Select an option [1...5 / 0]: 3 Mail sent.Hinweis
Wenn Sie mit einem Entwicklermandanten aus dem Microsoft 365-Entwicklerprogramm testen, wird die von Ihnen gesendete E-Mail möglicherweise nicht zugestellt, und Sie erhalten möglicherweise einen Unzustellbarkeitsbericht. In diesem Fall wenden Sie sich bitte über die Microsoft 365 Admin Center an den Support.
Code erklärt
Betrachten Sie den Code in der sendMailAsync Funktion.
Senden von E-Mails
Die Funktion wird an den Anforderungs-Generator _userClient.api übergeben/me/sendMail, der eine Anforderung an die Senden-E-Mail-API erstellt. Der Anforderungs-Generator übernimmt ein Message Objekt, das die zu sendende Nachricht darstellt.
Erstellen von Objekten
Im Gegensatz zu den vorherigen Aufrufen von Microsoft Graph, die nur Daten lesen, werden durch diesen Aufruf Daten erstellt. Um dies mit der Clientbibliothek zu tun, erstellen Sie eine Instanz der Klasse, Messagedie die Daten darstellt (in diesem Fall), legen Sie die gewünschten Eigenschaften fest, und senden Sie sie dann im API-Aufruf. Da der Aufruf Daten sendet, wird die post Methode anstelle von getverwendet.
Optional: Konfigurieren der reinen App-Authentifizierung
In diesem Abschnitt aktualisieren Sie die App-Registrierung aus dem vorherigen Abschnitt, um die Nur-App-Authentifizierung zu unterstützen. Nur-App-Authentifizierung ist eine gute Wahl für Hintergrunddienste, und es gibt auch einige APIs, die nur die Nur-App-Authentifizierung unterstützen. Sie müssen diesen Abschnitt nur abschließen, wenn Sie die Nur-App-Teile dieses Lernprogramms verwenden möchten. Andernfalls können Sie sicher zum nächsten Schritt springen.
Wichtig
Die Schritte in diesem Abschnitt erfordern ein Geschäfts-/Schulkonto mit der rolle globaler Administrator.
Öffnen Sie die App-Registrierung aus dem vorherigen Abschnitt im Azure AD Admin Center.
Wählen Sie API-Berechtigungen unter Verwalten aus.
Entfernen Sie die Standardberechtigung "User.Read " unter "Konfigurierte Berechtigungen ", indem Sie die Auslassungszeichen (...) in der Zeile und dann die Berechtigung "Entfernen" auswählen.
Wählen Sie "Berechtigung hinzufügen" und dann "Microsoft Graph" aus.
Wählen Sie Anwendungsberechtigungen aus.
Wählen Sie "User.Read.All" und dann " Berechtigungen hinzufügen" aus.
Wählen Sie "Administratorzustimmung erteilen für..." und dann " Ja " aus, um die Administratorzustimmung für die ausgewählte Berechtigung zu erteilen.
Wählen Sie unter "Verwalten" die Option "Zertifikate und geheime Schlüssel" und dann "Neuer geheimer Clientschlüssel" aus.
Geben Sie eine Beschreibung ein, wählen Sie eine Dauer und dann "Hinzufügen" aus.
Kopieren Sie den geheimen Schlüssel aus der Spalte "Wert" . Sie benötigen ihn in den nächsten Schritten.
Wichtig
Dieser geheime Clientschlüssel wird nicht noch einmal angezeigt, stellen Sie daher sicher, dass Sie ihn jetzt kopieren.
Hinweis
Beachten Sie, dass Sie im Gegensatz zu den Schritten bei der Registrierung für die Benutzerauthentifizierung in diesem Abschnitt Microsoft Graph Berechtigungen für die App-Registrierung konfiguriert haben. Dies liegt daran, dass die Nur-App-Authentifizierung den Clientanmeldeinformationsfluss verwendet, der erfordert, dass Berechtigungen für die App-Registrierung konfiguriert werden. Weitere Informationen finden Sie im Standardbereich .
Optional: Nur-App-Authentifizierung hinzufügen
In diesem Abschnitt fügen Sie der Anwendung die Nur-App-Authentifizierung hinzu. Dieser Abschnitt ist optional und erfordert den Abschluss von Optional: Konfigurieren der reinen App-Authentifizierung. Diese Schritte können nur mit einem Geschäfts-, Schul- oder Unikonto abgeschlossen werden.
Konfigurieren Graph Clients für die Nur-App-Authentifizierung
In diesem Abschnitt verwenden Sie die ClientSecretCredential Klasse, um ein Zugriffstoken mithilfe des Clientanmeldeinformationenflusses anzufordern.
Aktualisieren Sie die Werte gemäß
settingsder folgenden Tabelle.Einstellung Wert tenantIdMandanten-ID Ihrer Organisation clientSecretDer im vorherigen Schritt generierte geheime Clientschlüssel Aktualisieren Sie die Werte von
tenantIdin appsettings.js mit der Mandanten-ID Ihrer Organisation.Öffnen SiegraphHelper.js , und fügen Sie den folgenden Code hinzu.
Optional: Benutzer auflisten
In diesem Abschnitt fügen Sie die Möglichkeit hinzu, alle Benutzer in Ihrem Azure Active Directory mit nur app-Authentifizierung auflisten. Dieser Abschnitt ist optional und erfordert den Abschluss von "Optional:Konfigurieren der Nur-App-Authentifizierung " und "Optional: Nur-App-Authentifizierung hinzufügen". Diese Schritte können nur mit einem Geschäfts-, Schul- oder Unikonto abgeschlossen werden.
Öffnen SiegraphHelper.js , und fügen Sie die folgende Funktion hinzu.
Ersetzen Sie die leere
listUsersAsyncFunktion in index.js durch Folgendes.Führen Sie die App aus, melden Sie sich an, und wählen Sie Option 4 aus, um Benutzer auflisten zu können.
[1] Display access token [2] List my inbox [3] Send mail [4] List users (requires app-only) [5] Make a Graph call [0] Exit Select an option [1...5 / 0]: 4 User: Adele Vance ID: 05fb57bf-2653-4396-846d-2f210a91d9cf Email: AdeleV@contoso.com User: Alex Wilber ID: a36fe267-a437-4d24-b39e-7344774d606c Email: AlexW@contoso.com User: Allan Deyoung ID: 54cebbaa-2c56-47ec-b878-c8ff309746b0 Email: AllanD@contoso.com User: Bianca Pisani ID: 9a7dcbd0-72f0-48a9-a9fa-03cd46641d49 Email: NO EMAIL User: Brian Johnson (TAILSPIN) ID: a8989e40-be57-4c2e-bf0b-7cdc471e9cc4 Email: BrianJ@contoso.com ... More users available? true
Code erklärt
Betrachten Sie den Code in der getUsersAsync Funktion. Es ist dem Code in getInboxAsync:
- Es ruft eine Sammlung von Benutzern ab.
- Es verwendet
select, um bestimmte Eigenschaften anzufordern. - Es wird verwendet
top, um die Anzahl der zurückgegebenen Benutzer zu begrenzen. - Es wird
orderByverwendet, um die Antwort zu sortieren.
Der Hauptunterschied besteht darin, dass dieser Code die _appClient, nicht die _userClientverwendet. Beide Clients verwenden die gleiche Syntax und Anforderungs-Generatoren, wurden jedoch mit unterschiedlichen Anmeldeinformationen konfiguriert.
Optional: Eigenen Code hinzufügen
In diesem Abschnitt fügen Sie Der Anwendung Ihre eigenen Microsoft Graph-Funktionen hinzu. Dies kann ein Codeausschnitt aus der Microsoft Graph-Dokumentation oder Graph Explorer oder von Ihnen erstellter Code sein. Dieser Abschnitt ist optional.
Aktualisieren der App
Öffnen SiegraphHelper.js , und fügen Sie die folgende Funktion hinzu.
Ersetzen Sie die leere
makeGraphCallAsyncFunktion in index.js durch Folgendes.
Auswählen einer API
Suchen Sie eine API in Microsoft Graph, die Sie ausprobieren möchten. Beispiel: die Ereignis-API erstellen . Sie können eines der Beispiele in der API-Dokumentation verwenden oder eine API-Anforderung in Graph Explorer anpassen und den generierten Codeausschnitt verwenden.
Konfigurieren von Berechtigungen
Überprüfen Sie den Abschnitt "Berechtigungen" der Referenzdokumentation für die ausgewählte API, um zu sehen, welche Authentifizierungsmethoden unterstützt werden. Einige APIs unterstützen z. B. keine reinen App- oder persönlichen Microsoft-Konten.
- Fügen Sie zum Aufrufen einer API mit Benutzerauthentifizierung (wenn die API die Benutzerauthentifizierung unterstützt (delegierte Authentifizierung) den erforderlichen Berechtigungsbereich in appSettings.js hinzu.
- Um eine API mit Nur-App-Authentifizierung aufzurufen (wenn die API dies unterstützt), fügen Sie den erforderlichen Berechtigungsbereich im Azure AD Admin Center hinzu.
Hinzufügen ihres Codes
Kopieren Sie ihren Code in die makeGraphCallAsync Funktion in graphHelper.js. Wenn Sie einen Codeausschnitt aus der Dokumentation oder Graph Explorer kopieren, müssen Sie den client Code in den entsprechenden Client umbenennen: _userClient oder _appClient.
Herzlichen Glückwunsch!
Sie haben das JavaScript-Lernprogramm für Microsoft Graph abgeschlossen. Nachdem Sie nun über eine funktionierende App verfügen, die Microsoft Graph aufruft, können Sie experimentieren und neue Features hinzufügen. Besuchen Sie die Übersicht über Microsoft Graph, um alle Daten anzuzeigen, auf die Sie mit Microsoft Graph zugreifen können.
Microsoft Graph-Toolkit
Wenn Sie JavaScript-Apps mit benutzeroberfläche erstellen, bietet das Microsoft Graph Toolkit eine Sammlung von Komponenten, die die Entwicklung vereinfachen können.
TypeScript-/JavaScript-Beispiele
Liegt ein Problem mit diesem Abschnitt vor? Wenn ja, senden Sie uns Feedback, damit wir den Abschnitt verbessern können.