Rövid útmutató: Bejelentkezés beállítása ASP.NET alkalmazáshoz az Azure Active Directory B2C használatával

  • Cikk

Az Azure Active Directory B2C (Azure AD B2C) felhőalapú identitáskezelést biztosít az alkalmazás, az üzlet és az ügyfelek védelme érdekében. Az Azure AD B2C nyílt szabványú protokollokkal teszi lehetővé az alkalmazások hitelesítését közösségi hálózati és vállalati fiókokon.

Ebben a rövid útmutatóban egy ASP.NET-alkalmazással és egy közösségi identitásszolgáltatóval fog bejelentkezni, és meghív egy, az Azure AD B2C által védett webes API-t.

Előfeltételek

  • Visual Studio 2022 a ASP.NET és a webfejlesztési számítási feladattal.

  • Közösségi fiók a Facebookról, a Google-ból vagy a Microsoftból.

  • Töltse le a zip-fájlt, vagy klónozza a mintául szolgáló webalkalmazást a GitHubról.

    git clone https://github.com/Azure-Samples/active-directory-b2c-dotnet-webapp-and-webapi.git

    Két projekt szerepel a mintául szolgáló megoldásban:

    • TaskWebApp – Ez a webalkalmazás egy feladatlistát hoz létre és szerkeszt. A webalkalmazás a regisztrációs vagy bejelentkezési felhasználói folyamatot használja a felhasználók regisztrációjához vagy bejelentkezéséhez.
    • TaskService – Ez a webes API a feladatlista-funkciók létrehozását, olvasását, frissítését és törlését támogatja. A webes API-nak az Azure AD B2C biztosít védelmet, és a webalkalmazással hívható meg.

Az alkalmazás futtatása a Visual Studióban

  1. A mintaalkalmazás projektmappájában nyissa meg a B2C-WebAPI-DotNet.sln megoldást a Visual Studióban.

  2. Ebben a rövid útmutatóban egy időben futtatja a TaskWebApp és a TaskService projektet. Kattintson a jobb gombbal a B2C-WebAPI-DotNet megoldásra a Megoldáskezelőben, majd válassza az Indítási projektek konfigurálása... lehetőséget.

  3. Válassza a Több kezdőprojekt elemet, és mindkét projektnél módosítsa a Művelet értékét Indításra.

  4. Válassza az OK lehetőséget.

  5. Nyomja le az F5 billentyűt mindkét alkalmazás hibakereséséhez. Mindegyik alkalmazás saját böngészőlapon nyílik meg:

    • https://localhost:44316/ – Az ASP.NET-es webalkalmazás. A gyors útmutatóban közvetlenül kommunikál az alkalmazással.
    • https://localhost:44332/ – Az ASP.NET-es webalkalmazás által meghívott webes API.

Bejelentkezés saját fiókkal

  1. A munkafolyamat elindításához válassza a Regisztráció /Bejelentkezés a ASP.NET webalkalmazásba lehetőséget.

    Képernyőkép a minta ASP.NET webalkalmazásról a böngészőben, kiemelt regisztrációs/bejelentkezési hivatkozással

    A minta több regisztrációs beállítást is támogat, beleértve a közösségi identitásszolgáltató használatát vagy helyi fiók e-mail-címmel való létrehozását. Ebben a rövid útmutatóban a Facebook, a Google vagy a Microsoft közösségi identitásszolgáltatói fiókját használhatja.

  2. Azure AD B2C egy Fabrikam nevű fiktív vállalat bejelentkezési oldalát mutatja be a minta webalkalmazáshoz. Ha közösségi identitásszolgáltatóval szeretne regisztrálni, válassza ki a használni kívánt identitásszolgáltató gombját.

    Képernyőkép a Bejelentkezési vagy a Regisztrációs oldal identitásszolgáltató gombjairól

    A közösségi fiók hitelesítő adataival hitelesítheti (bejelentkezhet), és engedélyezheti, hogy az alkalmazás adatokat olvasson a közösségi fiókjából. A hozzáférés biztosításával az alkalmazás profiladatokat kérhet le a közösségi fiókból, például a nevét és a települését.

  3. Fejezze be az identitásszolgáltató bejelentkezési folyamatát.

Saját profil szerkesztése

Az Azure Active Directory B2C-funkcióival a felhasználók frissíthetik a profiljukat. A minta-webalkalmazás egy Azure AD B2C-profil felhasználói folyamatot használ a munkafolyamathoz.

  1. Az alkalmazás menüsávján válassza ki a profil nevét, majd válassza a Profil szerkesztése lehetőséget a létrehozott profil szerkesztéséhez.

    Képernyőkép a minta-webalkalmazásról a böngészőben a profil szerkesztése hivatkozás kiemelésével

  2. Módosítsa a Megjelenítendő nevet vagy a Várost, majd válassza a Folytatás lehetőséget a profil frissítéséhez.

    A módosítás a webalkalmazás kezdőlapjának jobb felső részén jelenik meg.

Védett API-erőforrás elérése

  1. Válassza To-Do Lista lehetőséget a teendőlista elemeinek megadásához és módosításához.

  2. Az Új elem szövegmezőbe írja be a szöveget. Ha meg szeretné hívni az Azure AD B2C által védett webes API-t, amely hozzáad egy teendőlistaelemet, válassza a Hozzáadás lehetőséget.

    Képernyőkép a mintául szolgáló webalkalmazásról a böngészőben, amelyen To-Do Lista hivatkozás és a Hozzáadás gomb van kiemelve.

    A ASP.NET webalkalmazás tartalmaz egy Microsoft Entra hozzáférési jogkivonatot a védett webes API-erőforrásnak küldött kérésben, amely műveleteket hajt végre a felhasználó teendőlistáján.

Sikeresen használta a Azure AD B2C felhasználói fiókját egy Azure AD B2C által védett webes API-ra irányuló engedélyezett hívás kezdeményezéséhez.

Következő lépések

Azure Active Directory B2C-bérlő létrehozása az Azure Portalon