教程:使用 Azure Active Directory B2C 在本机桌面客户端中对用户进行身份验证Tutorial: Authenticate users in a native desktop client using Azure Active Directory B2C

本教程展示了如何在 Windows Presentation Foundation (WPF) 桌面应用程序中使用 Azure Active Directory B2C (Azure AD B2C) 执行用户登录和注册。This tutorial shows you how to use Azure Active Directory B2C (Azure AD B2C) to sign in and sign up users in an Windows Presentation Foundation (WPF) desktop application. 应用程序可以使用 Azure AD B2C 通过开放式标准协议对社交帐户、企业帐户和 Azure Active Directory 帐户进行身份验证。Azure AD B2C enables your applications to authenticate to social accounts, enterprise accounts, and Azure Active Directory accounts using open standard protocols.

本教程介绍如何执行下列操作:In this tutorial, you learn how to:

  • 添加本机客户端应用程序Add the native client application
  • 将示例配置为使用此应用程序Configure the sample to use the application
  • 使用用户流进行登录Sign up using the user flow

如果没有 Azure 订阅,可在开始前创建一个试用帐户If you don't have an Azure subscription, create a trial account before you begin.

必备条件Prerequisites

添加本机客户端应用程序Add the native client application

要在 Azure AD B2C 租户中注册应用程序,可以使用新的统一“应用注册”体验或旧版“应用程序(旧版)”体验 。To register an application in your Azure AD B2C tenant, you can use our new unified App registrations experience or our legacy Applications (Legacy) experience. 详细了解此新体验Learn more about the new experience.

  1. 登录 Azure 门户Sign in to the Azure portal.
  2. 在顶部菜单中选择“目录 + 订阅”筛选器,然后选择包含Azure AD B2C 租户的目录。Select the Directory + subscription filter in the top menu, and then select the directory that contains your Azure AD B2C tenant.
  3. 在左侧菜单中,选择“Azure AD B2C”。In the left menu, select Azure AD B2C. 或者,选择“所有服务”并搜索并选择“Azure AD B2C”。Or, select All services and search for and select Azure AD B2C.
  4. 选择“应用注册”,然后选择“新建注册” 。Select App registrations, and then select New registration.
  5. 输入应用程序的“名称”。Enter a Name for the application. 例如,“nativeapp1”。For example, nativeapp1.
  6. 在“支持的帐户类型”下,选择“任何组织目录中或任何标识提供者中的帐户” 。Under Supported account types, select Accounts in any organizational directory or any identity provider.
  7. 在“重定向 URI”下,使用下拉选择“公共客户端/本机(移动和桌面)” 。Under Redirect URI, use the drop-down to select Public client/native (mobile & desktop).
  8. 输入使用唯一方案的重定向 URI。Enter a redirect URI with a unique scheme. 例如,com.onmicrosoft.contosob2c.exampleapp://oauth/redirectFor example, com.onmicrosoft.contosob2c.exampleapp://oauth/redirect. 选择重定向 URI 时,有两个重要的注意事项:There are two important considerations when choosing a redirect URI:
    • 唯一:每个应用程序的重定向 URI 的方案必须是唯一的。Unique: The scheme of the redirect URI must be unique for every application. 在示例 com.onmicrosoft.contosob2c.exampleapp://oauth/redirect 中,com.onmicrosoft.contosob2c.exampleapp 为方案。In the example com.onmicrosoft.contosob2c.exampleapp://oauth/redirect, com.onmicrosoft.contosob2c.exampleapp is the scheme. 应遵循此模式。This pattern should be followed. 如果两个应用程序共享同一方案,则用户应选择一个应用程序。If two applications share the same scheme, the user is given a choice to choose an application. 如果用户选择不正确,登录会失败。If the user chooses incorrectly, the sign-in fails.
    • 完整:重定向 URI 必须同时包含方案和路径。Complete: The redirect URI must have a both a scheme and a path. 路径必须在域之后包含至少一个正斜杠。The path must contain at least one forward slash after the domain. 例如,//oauth/ 有效而 //oauth 失败。For example, //oauth/ works while //oauth fails. 请勿在 URI 中包含特殊字符(例如,下划线)。Don't include special characters in the URI, for example, underscores.
  9. 在“权限”下,选择“授予对 openid 和 office_access 权限的管理员许可”复选框。Under Permissions, select the Grant admin consent to openid and offline_access permissions check box.
  10. 选择“注册”。Select Register.

记录“应用程序(客户端) ID”,以便在后续步骤中使用 。Record the Application (client) ID for use in a later step.

配置示例Configure the sample

在本教程中,你将配置一个可从 GitHub 下载的示例。In this tutorial, you configure a sample that you can download from GitHub. 示例 WPF 桌面应用程序演示了如何在 Azure AD B2C 中注册、登录和调用受保护的 Web API。The sample WPF desktop application demonstrates sign-up, sign-in, and can call a protected web API in Azure AD B2C. 从 GitHub 下载 zip 文件浏览存储库或克隆示例。Download a zip file, browse the repo, or clone the sample from GitHub.

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

更新应用程序以使用 Azure AD B2C 租户并调用其用户流(而不是默认演示租户中的用户流):To update the application to work with your Azure AD B2C tenant and invoke its user flows instead of those in the default demo tenant:

  1. 在 Visual Studio 中打开“active-directory-b2c-wpf”解决方案 (active-directory-b2c-wpf.sln) 。Open the active-directory-b2c-wpf solution (active-directory-b2c-wpf.sln) in Visual Studio.

  2. 在“active-directory-b2c-wpf”项目中,打开“App.xaml.cs”文件并查找以下变量定义 。In the active-directory-b2c-wpf project, open the App.xaml.cs file and find the following variable definitions. {your-tenant-name} 替换为 Azure AD B2C 租户名称,并将 {application-ID} 替换为之前记下的应用程序 ID。Replace {your-tenant-name} with your Azure AD B2C tenant name and {application-ID} with the application ID that you recorded earlier.

    private static readonly string Tenant = "{your-tenant-name}.partner.onmschina.cn";
    private static readonly string AzureAdB2CHostname = "{your-tenant-name}.b2clogin.cn";
    private static readonly string ClientId = "{application-ID}";
    
  3. 将策略名称变量更新为作为先决条件创建的用户流名称。Update the policy name variables with the names of the user flows that you created as part of the prerequisites. 例如:For example:

    public static string PolicySignUpSignIn = "B2C_1_signupsignin1";
    public static string PolicyEditProfile = "B2C_1_profileediting1";
    public static string PolicyResetPassword = "B2C_1_passwordreset1";
    

运行示例Run the sample

F5 生成并运行示例。Press F5 to build and run the sample.

使用电子邮件地址注册Sign up using an email address

  1. 选择“登录”以用户身份登录 。Select Sign In to sign up as a user. 这将使用 B2C_1_signupsignin1 用户流。This uses the B2C_1_signupsignin1 user flow.

  2. Azure AD B2C 会显示带“立即注册”链接的登录页面 。Azure AD B2C presents a sign in page with a Sign up now link. 由于你还没有帐户,因此请选择“立即注册”链接。 Since you don't yet have an account, select the Sign up now link.

  3. 注册工作流会显示一个页面,用于收集用户的标识并通过电子邮件地址对其进行验证。The sign-up workflow presents a page to collect and verify the user's identity using an email address. 注册工作流还收集用户的密码和请求的属性(在用户流中定义)。The sign-up workflow also collects the user's password and the requested attributes defined in the user flow.

    请使用有效的电子邮件地址,并使用验证码进行验证。Use a valid email address and validate using the verification code. 设置密码。Set a password. 输入请求的属性的值。Enter values for the requested attributes.

    作为登录/注册工作流的一部分显示的注册页

  4. 选择“创建”, 在 Azure AD B2C 租户中创建本地帐户。Select Create to create a local account in the Azure AD B2C tenant.

现在,用户可以使用其电子邮件地址登录并使用桌面应用程序。The user can now use their email address to sign in and use the desktop application. 成功注册或登录后,WPF 应用的下方窗格中会显示令牌详细信息。After a successful sign-up or sign-in, the token details are displayed in the lower pane of the WPF app.

WPF 桌面应用程序底部窗格中显示的令牌详细信息

如果选择“调用 API”按钮,则会显示“错误消息” 。If you select the Call API button, an error message is displayed. 出现该错误的原因是,在其当前状态下,应用程序尝试访问由演示租户 fabrikamb2c.partner.onmschina.cn 保护的 API。You encounter the error because, in its current state, the application is attempting to access an API protected by the demo tenant, fabrikamb2c.partner.onmschina.cn. 由于访问令牌仅对 Azure AD B2C 租户有效,因此 API 调用是未经授权的。Since your access token is valid only for your Azure AD B2C tenant, the API call is therefore unauthorized.

继续学习下一教程,在自己的租户中注册受保护的 Web API,并启用“调用 API”功能 。Continue to the next tutorial to register a protected web API in your own tenant and enable the Call API functionality.

后续步骤Next steps

在本教程中,你已学习了如何执行以下操作:In this tutorial, you learned how to:

  • 添加本机客户端应用程序Add the native client application
  • 将示例配置为使用此应用程序Configure the sample to use the application
  • 使用用户流进行登录Sign up using the user flow

接下来,要启用“调用 API”按钮功能,请向 WPF 桌面应用程序授予访问自己 Azure AD B2C 租户所注册 Web API 的权限 :Next, to enable the Call API button functionality, grant the WPF desktop application access to a web API registered in your own Azure AD B2C tenant: