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

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 egyoldalas 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 Code

• Node.js

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

• Kódminta a GitHubról: ms-identity-b2c-javascript-spa:

  Letöltheti a zip-archívumot, vagy klónozhatja az adattárat

  git clone https://github.com/Azure-Samples/ms-identity-b2c-javascript-spa.git
  

Az alkalmazás futtatása

1. Indítsa el a kiszolgálót úgy, hogy futtatja a következő parancsokat a Node.js-parancssorban:

   npm install
   npm update
   npm start
   

   A server.js által indított kiszolgáló megjeleníti a portot, amelyen figyel:

   Listening on port 6420...
   

2. Nyissa meg az alkalmazás URL-címét. Például: http://localhost:6420.

Bejelentkezés saját fiókkal

1. Válassza a Bejelentkezés lehetőséget a felhasználói folyamat elindításához.

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.

   

   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.

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

Válassza az API meghívása lehetőséget, hogy a webes API-ból JSON-objektumként adja vissza a megjelenítendő nevet.

Az egyoldalas mintaalkalmazás a védett webes API-erőforrás felé küldött kérésbe belefoglal egy hozzáférési jogkivonatot.

Következő lépések

• Saját Azure Active Directory B2C-bérlő létrehozása a Azure Portal