Konfigurace ověřování v ukázkové desktopové aplikaci WPF pomocí Azure AD B2C

  • Článek

Tento článek používá ukázkovou desktopovou aplikaci WPF (Windows Presentation Foundation) k ilustraci přidání ověřování Azure Active Directory B2C (Azure AD B2C) do desktopových aplikací.

Přehled

OpenID Připojení (OIDC) je ověřovací protokol založený na OAuth 2.0. Pomocí OIDC můžete bezpečně přihlásit uživatele k aplikaci. Tato ukázka desktopové aplikace používá knihovnu Microsoft Authentication Library (MSAL) s tokem ověřovacího kódu OIDC pro tok PKCE (Code Exchange). MSAL je knihovna poskytovaná Microsoftem, která zjednodušuje přidávání podpory ověřování a autorizace do desktopových aplikací.

Tok přihlášení zahrnuje následující kroky:

  1. Uživatelé aplikaci otevřou a vyberou přihlášení.
  2. Aplikace otevře systémový prohlížeč desktopového zařízení a spustí žádost o ověření do Azure AD B2C.
  3. Uživatelé se zaregistrují nebo přihlásí, resetují heslo nebo se přihlásí pomocí účtu sociální sítě.
  4. Jakmile se uživatelé úspěšně přihlásí, Azure AD B2C vrátí autorizační kód do aplikace.
  5. Aplikace provede následující akce:
    1. Autorizační kód se vymění s tokenem ID, přístupovým tokenem a obnovovacím tokenem.
    2. Načte deklarace identity tokenu ID.
    3. Ukládá tokeny do mezipaměti v paměti pro pozdější použití.

Přehled registrace aplikací

Pokud chcete aplikaci povolit přihlášení pomocí Azure AD B2C a volání webového rozhraní API, zaregistrujte dvě aplikace v adresáři Azure AD B2C.

  • Registrace desktopové aplikace umožňuje aplikaci přihlásit se pomocí Azure AD B2C. Během registrace aplikace zadejte identifikátor URI přesměrování. Identifikátor URI přesměrování je koncový bod, na který jsou uživatelé přesměrováni službou Azure AD B2C po ověření pomocí Azure AD B2C. Proces registrace aplikace vygeneruje ID aplikace, označované také jako ID klienta, které jednoznačně identifikuje vaši desktopovou aplikaci (například ID aplikace: 1).

  • Registrace webového rozhraní API umožňuje vaší aplikaci volat chráněné webové rozhraní API. Registrace zveřejňuje oprávnění webového rozhraní API (obory). Proces registrace aplikace vygeneruje ID aplikace, které jednoznačně identifikuje vaše webové rozhraní API (například ID aplikace: 2). Udělte desktopové aplikaci (ID aplikace: 1) oprávnění k oborům webového rozhraní API (ID aplikace: 2).

Registrace a architektura aplikace jsou znázorněny v následujících diagramech:

Diagram of the desktop app with web API, registrations, and tokens.

Volání webového rozhraní API

Po dokončení ověřování uživatelé komunikují s aplikací, která vyvolá chráněné webové rozhraní API. Webové rozhraní API používá ověřování nosné tokeny . Nosný token je přístupový token, který aplikace získala z Azure AD B2C. Aplikace předá token v autorizační hlavičce požadavku HTTPS.

Authorization: Bearer <access token>

Pokud obor přístupového tokenu neodpovídá oborům webového rozhraní API, knihovna ověřování získá nový přístupový token se správnými obory.

Tok odhlášení

Tok odhlášení zahrnuje následující kroky:

  1. Z aplikace se uživatelé odhlásí.
  2. Aplikace vymaže objekty relace a knihovna ověřování vymaže mezipaměť tokenů.
  3. Aplikace přesáhne uživatele do koncového bodu pro odhlášení z Azure AD B2C, aby ukončila relaci Azure AD B2C.
  4. Uživatelé se přesměrují zpět do aplikace.

Požadavky

Počítač se sadou Visual Studio 2019 s vývojem desktopových aplikací .NET

Krok 1: Konfigurace toku uživatele

Když se uživatelé pokusí přihlásit k aplikaci, aplikace spustí žádost o ověření do koncového bodu autorizace prostřednictvím toku uživatele. Tok uživatele definuje a řídí uživatelské prostředí. Jakmile uživatelé dokončí tok uživatele, Azure AD B2C vygeneruje token a pak přesměruje uživatele zpět do vaší aplikace.

Pokud jste to ještě neudělali, vytvořte tok uživatele nebo vlastní zásadu. Opakujte kroky pro vytvoření tří samostatných toků uživatelů následujícím způsobem:

  • Kombinovaný tok přihlášení a registrace uživatele, například susi. Tento tok uživatele podporuje také zapomenuté heslo .
  • Profil upravuje tok uživatele, například edit_profile.
  • Tok uživatele resetování hesla, například reset_password.

Předzálohuje B2C_1_ Azure AD B2C na název toku uživatele. Například z susi se stane B2C_1_susi.

Krok 2: Registrace aplikací

Vytvořte desktopovou aplikaci a registraci aplikace webového rozhraní API a určete rozsahy webového rozhraní API.

Krok 2.1: Registrace aplikace webového rozhraní API

Pokud chcete vytvořit registraci aplikace webového rozhraní API (ID aplikace: 2), postupujte takto:

  1. Přihlaste se k portálu Azure.

  2. Ujistěte se, že používáte adresář, který obsahuje vašeho tenanta Azure AD B2C. Na panelu nástrojů portálu vyberte ikonu Adresáře a předplatná .

  3. V nastavení portálu | Adresářů a stránka předplatných , vyhledejte adresář Azure AD B2C v seznamu názvů adresářů a pak vyberte Přepnout.

  4. Na webu Azure Portal vyhledejte a vyberte Azure AD B2C.

  5. Vyberte Registrace aplikací a pak vyberte Nová registrace.

  6. Jako Název zadejte název aplikace (například my-api1). U identifikátoru URI přesměrování a podporovaných typů účtů ponechte výchozí hodnoty.

  7. Vyberte Zaregistrovat.

  8. Po dokončení registrace aplikace vyberte Přehled.

  9. Poznamenejte si hodnotu ID aplikace (klienta) pro pozdější použití při konfiguraci webové aplikace.

    Screenshot that demonstrates how to get a web A P I application I D.

Krok 2.2: Konfigurace oborů aplikací webového rozhraní API

  1. Výběrem aplikace my-api1, kterou jste vytvořili (ID aplikace: 2), otevřete její stránku Přehled.

  2. V části Spravovat vyberte Zveřejnit rozhraní API.

  3. Vedle identifikátoru URI ID aplikace vyberte odkaz Nastavit. Nahraďte výchozí hodnotu (GUID) jedinečným názvem (například tasks-api) a pak vyberte Uložit.

    Když vaše webová aplikace požádá o přístupový token pro webové rozhraní API, měl by tento identifikátor URI přidat jako předponu pro každý obor, který definujete pro rozhraní API.

  4. V části Obory definované tímto rozhraním API vyberte Přidat obor.

  5. Vytvoření oboru, který definuje přístup pro čtení k rozhraní API:

    1. Jako název oboru zadejte tasks.read.
    2. Pro Správa zobrazovaný název souhlasu zadejte přístup pro čtení k rozhraní API pro úlohy.
    3. Jako popis souhlasu Správa zadejte Možnost Umožňuje přístup pro čtení k rozhraní API pro úlohy.

  6. Vyberte Přidat rozsah.

  7. Vyberte Přidat obor a pak přidejte obor, který definuje přístup k zápisu do rozhraní API:

    1. Jako název oboru zadejte tasks.write.
    2. Pro Správa zobrazovaný název souhlasu zadejte přístup k zápisu do rozhraní API pro úlohy.
    3. Jako popis souhlasu Správa zadejte Povolení přístupu k zápisu do rozhraní API pro úlohy.

  8. Vyberte Přidat rozsah.

Krok 2.3: Registrace desktopové aplikace

Pokud chcete vytvořit registraci desktopové aplikace, postupujte takto:

  1. Přihlaste se k portálu Azure.
  2. Vyberte Registrace aplikací a pak vyberte Nová registrace.
  3. V části Název zadejte název aplikace (například desktop-app1).
  4. V sekci Podporované typy účtů vyberte Účty u libovolného zprostředkovatele identity nebo organizačního adresáře (pro ověřování uživatelů pomocí toků uživatelů).
  5. V části Identifikátor URI pro přesměrování vyberte veřejný klient nebo nativní (desktopová plocha) a pak do pole adresa URL zadejte https://your-tenant-name.b2clogin.com/oauth2/nativeclient. Nahraďte your-tenant-name názvem vašeho tenanta. Další možnosti najdete v tématu Konfigurace identifikátoru URI přesměrování.
  6. Vyberte Zaregistrovat.
  7. Po dokončení registrace aplikace vyberte Přehled.
  8. Poznamenejte si ID aplikace (klienta) pro pozdější použití při konfiguraci desktopové aplikace. Screenshot highlighting the desktop application ID.

Krok 2.4: Udělení oprávnění desktopové aplikace pro webové rozhraní API

Pokud chcete aplikaci udělit oprávnění (ID aplikace: 1), postupujte takto:

  1. Vyberte Registrace aplikací a pak vyberte aplikaci, kterou jste vytvořili (ID aplikace: 1).

  2. V části Spravovat vyberte oprávnění rozhraní API.

  3. V části Nakonfigurovaná oprávnění vyberte Přidat oprávnění.

  4. Vyberte kartu Moje rozhraní API.

  5. Vyberte rozhraní API (ID aplikace: 2), ke kterému má mít webová aplikace udělený přístup. Zadejte například my-api1.

  6. V části Oprávnění rozbalte úkoly a vyberte obory, které jste definovali dříve (například tasks.read a tasks.write).

  7. Vyberte Přidat oprávnění.

  8. Vyberte Udělení souhlasu správce pro <název> vašeho tenanta.

  9. Vyberte Ano.

  10. Vyberte Aktualizovat a potom ověřte, že se pro oba obory zobrazuje hodnota Uděleno pro ... .

  11. V seznamu Nakonfigurovaná oprávnění vyberte obor a zkopírujte celý název oboru.

    Screenshot of the configured permissions pane, showing that read access permissions are granted.

Krok 3: Konfigurace ukázkového webového rozhraní API

Tato ukázka získá přístupový token s relevantními obory, které může desktopová aplikace používat pro webové rozhraní API. Pokud chcete volat webové rozhraní API z kódu, postupujte takto:

  1. Použijte existující webové rozhraní API nebo vytvořte nové. Další informace najdete v tématu Povolení ověřování ve vlastním webovém rozhraní API pomocí Azure AD B2C.
  2. Po konfiguraci webového rozhraní API zkopírujte identifikátor URI koncového bodu webového rozhraní API. V dalších krocích použijete koncový bod webového rozhraní API.

Tip

Pokud nemáte webové rozhraní API, můžete tuto ukázku přesto spustit. V tomto případě aplikace vrátí přístupový token, ale nebude moct volat webové rozhraní API.

Krok 4: Získání ukázky desktopové aplikace WPF

  1. Stáhněte si soubor .zip nebo naklonujte ukázkovou webovou aplikaci z úložiště GitHub.

    git clone https://github.com/Azure-Samples/active-directory-b2c-dotnet-desktop.git

  2. Otevřete řešení active-directory-b2c-wpf (soubor active-directory-b2c-wpf.sln) v sadě Visual Studio.

Krok 5: Konfigurace ukázkové desktopové aplikace

V projektu active-directory-b2c-wpf otevřete soubor App.xaml.cs. Členové App.xaml.cs třídy obsahují informace o vašem zprostředkovateli identity Azure AD B2C. Desktopová aplikace používá tyto informace k vytvoření vztahu důvěryhodnosti s Azure AD B2C, přihlášení a odhlášení uživatelů, získání tokenů a jejich ověření.

Aktualizujte následující členy třídy:

Key Hodnota
TenantName První část názvu tenanta Azure AD B2C (napříkladcontoso.b2clogin.com).
ClientId ID desktopové aplikace z kroku 2.3.
PolicySignUpSignIn Tok uživatele registrace nebo přihlášení nebo vlastní zásady, které jste vytvořili v kroku 1.
PolicyEditProfile Tok uživatele profilu pro úpravy nebo vlastní zásady, které jste vytvořili v kroku 1.
ApiEndpoint (Volitelné) Koncový bod webového rozhraní API, který jste vytvořili v kroku 3 (například https://contoso.azurewebsites.net/hello).
ApiScopes Obory webového rozhraní API, které jste vytvořili v kroku 2.4.

Konečný soubor App.xaml.cs by měl vypadat jako následující kód jazyka C#:

public partial class App : Application
{

private static readonly string TenantName = "contoso";
private static readonly string Tenant = $"{TenantName}.onmicrosoft.com";
private static readonly string AzureAdB2CHostname = $"{TenantName}.b2clogin.com";
private static readonly string ClientId = "<web-api-app-application-id>";
private static readonly string RedirectUri = $"https://{TenantName}.b2clogin.com/oauth2/nativeclient";

public static string PolicySignUpSignIn = "b2c_1_susi";
public static string PolicyEditProfile = "b2c_1_edit_profile";
public static string PolicyResetPassword = "b2c_1_reset";

public static string[] ApiScopes = { $"https://{Tenant}//api/tasks.read" };
public static string ApiEndpoint = "https://contoso.azurewebsites.net/hello";

Krok 6: Spuštění a otestování desktopové aplikace

  1. Obnovte balíčky NuGet.

  2. Výběrem klávesy F5 sestavte a spusťte ukázku.

  3. Vyberte Přihlásit se a pak se zaregistrujte nebo přihlaste pomocí místního nebo sociálního účtu Azure AD B2C.

    Screenshot highlighting how to start the sign-in flow.

  4. Po úspěšné registraci nebo přihlášení se podrobnosti o tokenu zobrazí v dolním podokně aplikace WPF.

    Screenshot highlighting the Azure AD B2C access token and user ID.

  5. Vyberte volání rozhraní API pro volání webového rozhraní API.

Další kroky

Zjistěte, jak nakonfigurovat možnosti ověřování v desktopové aplikaci WPF pomocí Azure AD B2C.