Szervezeti adatok: Microsoft Entra-azonosító alkalmazásregisztráció létrehozása

A felhasználói hatékonyság növeléséhez integrálja a szervezeti adatokat (e-maileket, fájlokat, csevegéseket és naptáreseményeket) közvetlenül az egyéni alkalmazásokba. A Microsoft Graph API-kkal és a Microsoft Entra ID-kkal zökkenőmentesen lekérheti és megjelenítheti a releváns adatokat az alkalmazásokban, így csökkentve a felhasználók számára a környezetváltás szükségességét. Akár egy ügyfélnek küldött e-mailre hivatkozik, akár egy Teams-üzenetre hivatkozik, akár egy fájlhoz fér hozzá, a felhasználók gyorsan megtalálhatják a szükséges információkat anélkül, hogy elhagyják az alkalmazást, és egyszerűsítenék a döntéshozatali folyamatukat.

Ebben a gyakorlatban a következőt fogja elvégezni:

• Hozzon létre egy Microsoft Entra-azonosítós alkalmazásregisztrációt, hogy a Microsoft Graph hozzáférhessen a szervezeti adatokhoz, és be tudja őket vinni az alkalmazásba.
• Megkeresheti team és channel azonosíthatja azokat a Microsoft Teams-csoportokat, amelyek a csevegőüzenetek adott csatornára való küldéséhez szükségesek.
• Frissítse a projekt .env fájlját a Microsoft Entra ID-alkalmazásregisztráció értékeivel.

Microsoft Entra-azonosító alkalmazásregisztráció létrehozása

1. Nyissa meg az Azure Portalt , és válassza a Microsoft Entra-azonosítót.

2. Válassza a Kezelés –->Alkalmazásregisztrációk , majd az + Új regisztráció lehetőséget.

3. Töltse ki az új alkalmazásregisztrációs űrlap adatait az alább látható módon, és válassza a Regisztráció lehetőséget:

   • Név: microsoft-graph-app
   • Támogatott fióktípusok: Bármely szervezeti címtárban lévő fiókok (Bármely Microsoft Entra ID-bérlő – Több-bérlő)
   • Átirányítási URI:
     • Válassza az Egyoldalas alkalmazás (SPA) lehetőséget, és írja be http://localhost:4200 az Átirányítás URI mezőbe.
   • Az alkalmazásregisztráció létrehozásához válassza a Regisztráció lehetőséget.

   

1. Válassza az Erőforrás menü Áttekintés elemét, és másolja az értéket a Application (client) ID vágólapra.

   

A projekt .env fájljának frissítése

1. Nyissa meg az .env fájlt a szerkesztőben, és rendelje hozzá az Application (client) ID értéket ENTRAID_CLIENT_ID.

   ENTRAID_CLIENT_ID=<APPLICATION_CLIENT_ID_VALUE>
   

2. Ha engedélyezni szeretné, hogy üzenetet küldjön az alkalmazásból egy Teams-csatornába, jelentkezzen be a Microsoft Teamsbe a Microsoft 365 fejlesztői bérlői fiókjával (ezt az oktatóanyag előzetes lépéseiben is említettük).

3. Miután bejelentkezett, bontsa ki a csoportot, és keressen egy csatornát, ahová üzeneteket szeretne küldeni az alkalmazásból. Kiválaszthatja például a Céges csoportot és az Általános csatornát (vagy azt a csoportot/csatornát, amelyet használni szeretne).

   

4. A csapatfejlécen kattintson a három pontra (...), és válassza a Csapat hivatkozásának lekérése lehetőséget.

5. Az előugró ablakban megjelenő hivatkozásban a csapatazonosító a betűk és számok sztringje.team/ A "https://teams.microsoft.com/l/team/19%3ae9b9.../"" hivatkozásban például a csapatazonosító 19%3ae9b9... karakterig / .

6. Másolja ki a csapatazonosítót, és rendelje hozzá TEAM_ID az .env fájlban.

7. A csatorna fejlécében kattintson a három pontra (...), és válassza a Csatorna hivatkozásának lekérése lehetőséget.

8. Az előugró ablakban megjelenő hivatkozásban a csatorna azonosítója a betűk és számok sztringje.channel/ Például a "https://teams.microsoft.com/l/channel/19%3aQK02.../"" hivatkozásban a csatorna azonosítója 19%3aQK02... karakterig / .

9. Másolja ki a csatornaazonosítót, és rendelje hozzá CHANNEL_ID az .env fájlban.

10. A folytatás előtt mentse az env fájlt.

Az alkalmazás- és API-kiszolgálók indítása/újraindítása

Hajtsa végre az alábbi lépések egyikét az eddig elvégzett gyakorlatok alapján:

• Ha egy korábbi gyakorlatban elindította az adatbázist, az API-kiszolgálót és a webkiszolgálót, le kell állítania az API-kiszolgálót és a webkiszolgálót, majd újra kell indítania őket az .env fájlmódosítások felvételéhez. Hagyja futni az adatbázist.

  Keresse meg az API-kiszolgálót és a webkiszolgálót futtató terminálablakokat, és állítsa le a CTRL + C billentyűkombinációt . Indítsa újra őket az egyes terminálablakok beírásával npm start és az Enter billentyű lenyomásával. Folytassa a következő gyakorlatra.

• Ha még nem indította el az adatbázist, az API-kiszolgálót és a webkiszolgálót, hajtsa végre a következő lépéseket:

  1. A következő lépésekben három terminálablakot fog létrehozni a Visual Studio Code-ban.

     

  2. Kattintson a jobb gombbal az .env fájlra a Visual Studio Code fájllistában, és válassza a Megnyitás az integrált terminálban lehetőséget. A folytatás előtt győződjön meg arról, hogy a terminál a projekt gyökerénél van – openai-acs-msgraph .

  3. A PostgreSQL-adatbázis elindításához válasszon az alábbi lehetőségek közül :

     • Ha telepítette és futtatta a Docker Desktopot , futtassa docker-compose up a terminálablakban, és nyomja le az Enter billentyűt.

     • Ha podman-compose telepítéssel és futtatással rendelkezik, futtassa podman-compose up a terminálablakban, és nyomja le az Enter billentyűt.

     • Ha a PostgreSQL-tárolót közvetlenül a Docker Desktop, a Podman, a nerdctl vagy egy másik telepített tároló-futtatókörnyezet használatával szeretné futtatni, futtassa a következő parancsot a terminálablakban:

       • Mac, Linux vagy Linuxos Windows-alrendszer (WSL):

         [docker | podman | nerdctl] run --name postgresDb -e POSTGRES_USER=web -e POSTGRES_PASSWORD=web-password -e POSTGRES_DB=CustomersDB -v $(pwd)/data:/var/lib/postgresql/data -p 5432:5432 postgres
         

       • Windows a PowerShell-lel:

         [docker | podman] run --name postgresDb -e POSTGRES_USER=web -e POSTGRES_PASSWORD=web-password -e POSTGRES_DB=CustomersDB -v ${PWD}/data:/var/lib/postgresql/data -p 5432:5432 postgres
         

  4. Az adatbázis-tároló elindítása után a + Visual Studio Code Terminál eszköztárában található ikonra kattintva hozzon létre egy második terminálablakot.

     

  5. cd a kiszolgáló/typescript mappába, és futtassa a következő parancsokat a függőségek telepítéséhez és az API-kiszolgáló elindításához.

     • npm install
     • npm start

  6. Egy harmadik terminálablak létrehozásához nyomja le ismét az + ikont a Visual Studio Code Terminál eszköztárán .

  7. cd az ügyfélmappába , és futtassa az alábbi parancsokat a függőségek telepítéséhez és a webkiszolgáló elindításához.

     • npm install
     • npm start

  8. Ekkor elindul egy böngésző, és a rendszer a következőre http://localhost:4200viszi: .

     

Következő lépés

Szervezeti adatok: Felhasználó bejelentkezése és hozzáférési jogkivonat lekérése