教程:使用 Azure Active Directory B2C 授予对 ASP.NET Web API 的访问权限Tutorial: Grant access to an ASP.NET web API using Azure Active Directory B2C

本教程介绍如何从 ASP.NET Web 应用程序调用 Azure Active Directory (Azure AD) B2C 中受保护的 Web API 资源。This tutorial shows you how to call a protected web API resource in Azure Active Directory (Azure AD) B2C from an ASP.NET web application.

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

  • 添加 Web API 应用程序Add a web API application
  • 配置 Web API 的范围Configure scopes for a web API
  • 授予 Web API 权限Grant permissions to the web API
  • 将示例配置为使用此应用程序Configure the sample to use the application

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

先决条件Prerequisites

完成教程:使用 Azure Active Directory B2C 在 Web 应用程序中启用身份验证中的步骤和先决条件。Complete the steps and prerequisites in Tutorial: Enable authenticate in a web application using Azure Active Directory B2C.

添加 Web API 应用程序Add a web API application

Web API 资源需要先在租户中注册,然后才能接受并响应提供访问令牌的客户端应用程序所提出的受保护资源请求。Web API resources need to be registered in your tenant before they can accept and respond to protected resource requests by client applications that present an access token.

  1. 登录到 Azure 门户Sign in to the Azure portal.
  2. 请确保使用包含 Azure AD B2C 租户的目录,方法是单击顶部菜单中的“目录和订阅筛选器”,然后选择包含租户的目录 。Make sure you're using the directory that contains your Azure AD B2C tenant by clicking the Directory and subscription filter in the top menu and choosing the directory that contains your tenant.
  3. 选择 Azure 门户左上角的“所有服务”,然后搜索并选择“Azure AD B2C” 。Choose All services in the top-left corner of the Azure portal, and then search for and select Azure AD B2C.
  4. 选择“应用程序”,然后选择“添加” 。Select Applications, and then select Add.
  5. 输入应用程序的名称。Enter a name for the application. 例如,“webapi1” 。For example, webapi1.
  6. 对于“包括 Web 应用/Web API”和“允许隐式流”,请选择“是”。 For Include web app/ web API and Allow implicit flow, select Yes.
  7. 对于“回复 URL”,请输入 Azure AD B2C 要将应用程序请求的任何令牌返回到的终结点 。For Reply URL, enter an endpoint where Azure AD B2C should return any tokens that your application requests. 本教程中的示例在本地运行并在 https://localhost:44332 上进行侦听。In this tutorial, the sample runs locally and listens at https://localhost:44332.
  8. 对于“应用 ID URI”,请输入 Web API 使用的标识符。 For App ID URI, enter the identifier used for your web API. 包括域在内的完整标识符 URI 是为你生成的。The full identifier URI including the domain is generated for you. 例如,https://contosotenant.partner.onmschina.cn/apiFor example, https://contosotenant.partner.onmschina.cn/api.
  9. 单击创建Click Create.
  10. 在属性页上,记录在配置 Web 应用程序时要使用的应用程序 ID。On the properties page, record the application ID that you'll use when you configure the web application.

配置范围Configure scopes

可通过范围控制对受保护资源的访问。Scopes provide a way to govern access to protected resources. Web API 使用作用域实施基于作用域的访问控制。Scopes are used by the web API to implement scope-based access control. 例如,可以让 Web API 用户拥有读取和写入访问权限,或者只拥有读取访问权限。For example, users of the web API could have both read and write access, or users of the web API might have only read access. 在本教程中,请使用作用域为 Web API 定义读取和写入权限。In this tutorial, you use scopes to define read and write permissions for the web API.

  1. 选择“应用程序”,然后选择“webapi1” 。Select Applications, and then select webapi1.
  2. 选择“已发布的范围” 。Select Published scopes.
  3. 在“范围”中输入 Hello.Read,在“说明”中输入 Read access to helloFor scope, enter Hello.Read, and for description, enter Read access to hello.
  4. 在“范围”中输入 Hello.Write,在“说明”中输入 Write access to helloFor scope, enter Hello.Write, and for description, enter Write access to hello.
  5. 单击“保存” 。Click Save.

可以使用已发布的范围向客户端应用程序授予访问 Web API 的权限。The published scopes can be used to grant a client application permission to the web API.

授予权限Grant permissions

若要从应用程序调用受保护的 Web API,需授予应用程序访问该 API 的权限。To call a protected web API from an application, you need to grant your application permissions to the API. 在先决条件教程中,已在 Azure AD B2C 中创建名为 webapp1 的 Web 应用程序。In the prerequisite tutorial, you created a web application in Azure AD B2C named webapp1. 使用此应用程序调用 Web API。You use this application to call the web API.

  1. 依次选择“应用程序”、“webapp1” 。Select Applications, and then select webapp1.
  2. 依次选择“API 访问”、“添加” 。Select API access, and then select Add.
  3. 在“选择 API”下拉列表中,选择“webapi1” 。In the Select API dropdown, select webapi1.
  4. 在“选择范围”下拉列表中,选择之前定义的“Hello.Read”和“Hello.Write”范围 。In the Select Scopes dropdown, select the Hello.Read and Hello.Write scopes that you previously defined.
  5. 单击 “确定”Click OK.

注册应用程序以调用受保护的 Web API。Your application is registered to call the protected web API. 用户通过 Azure AD B2C 进行身份验证,以便使用该应用程序。A user authenticates with Azure AD B2C to use the application. 该应用程序从 Azure AD B2C 获取授权,以访问受保护的 Web API。The application obtains an authorization grant from Azure AD B2C to access the protected web API.

配置示例Configure the sample

注册 Web API 并定义范围之后,请将 Web API 配置为使用你的 Azure AD B2C 租户。Now that the web API is registered and you have scopes defined, you configure the web API to use your Azure AD B2C tenant. 在本教程中,可以配置一个示例 Web API。In this tutorial, you configure a sample web API. 在先决条件教程中下载的项目中包含了示例 Web API。The sample web API is included in the project you downloaded in the prerequisite tutorial.

示例解决方案中有两个项目:There are two projects in the sample solution:

示例解决方案中包含以下两个项目:The following two projects are in the sample solution:

  • TaskWebApp - 创建和编辑任务列表。TaskWebApp - Create and edit a task list. 该示例使用注册或登录用户流来注册或登录用户。The sample uses the sign-up or sign-in user flow to sign up or sign in users.
  • TaskService - 支持创建、读取、更新和删除任务列表功能。TaskService - Supports the create, read, update, and delete task list functionality. 该 API 受 Azure AD B2C 的保护,由 TaskWebApp 调用。The API is protected by Azure AD B2C and called by TaskWebApp.

配置 Web 应用程序Configure the web application

  1. 在 Visual Studio 中打开 B2C-WebAPI-DotNet 解决方案。Open the B2C-WebAPI-DotNet solution in Visual Studio.

  2. 打开 TaskWebApp 项目中的 Web.configOpen Web.config in the TaskWebApp project.

  3. 若要在本地运行 API,请使用针对 api:TaskServiceUrl 的 localhost 设置。To run the API locally, use the localhost setting for api:TaskServiceUrl. 更改 Web.config,如下所示:Change the Web.config as follows:

    <add key="api:TaskServiceUrl" value="https://localhost:44332/"/>
    
  4. 配置 API 的 URI。Configure the URI of the API. 这是 Web 应用程序用来发起 API 请求的 URI。This is the URI the web application uses to make the API request. 另请配置所请求的权限。Also, configure the requested permissions.

    <add key="api:ApiIdentifier" value="https://<Your tenant name>.partner.onmschina.cn/api/" />
    <add key="api:ReadScope" value="Hello.Read" />
    <add key="api:WriteScope" value="Hello.Write" />
    

配置 Web APIConfigure the web API

  1. 打开 TaskService 项目中的 Web.configOpen Web.config in the TaskService project.

  2. 配置要使用租户的 API。Configure the API to use your tenant.

    <add key="ida:Tenant" value="<Your tenant name>.partner.onmschina.cn" />
    
  3. 将客户端 ID 设置为 API 的注册应用程序 ID。Set the client ID to the registered Application ID for your API.

    <add key="ida:ClientId" value="<application-ID>"/>
    
  4. 使用注册和登录用户流的名称更新用户流设置。Update the user flow setting with the name of the sign up and sign-in user flow.

    <add key="ida:SignUpSignInUserFlowId" value="B2C_1_signupsignin1" />
    
  5. 配置作用域设置,使之与门户中创建的设置相匹配。Configure the scopes setting to match what you created in the portal.

    <add key="api:ReadScope" value="Hello.Read" />
    <add key="api:WriteScope" value="Hello.Write" />
    

运行示例Run the sample

TaskWebAppTaskService 项目都需要运行。You need to run both the TaskWebApp and TaskService projects.

  1. 在解决方案资源管理器中,右键单击解决方案并选择“设置启动项目...”。 In Solution Explorer, right-click on the solution and select Set StartUp Projects....

  2. 选择“多启动项目”。 Select Multiple startup projects.

  3. 将两个项目的“操作”更改为“启动”。 Change the Action for both projects to Start.

  4. 单击“确定”以保存配置。 Click OK to save the configuration.

  5. F5 运行这两个应用程序。Press F5 to run both applications. 每个应用程序将在其自身的浏览器标签页中打开。https://localhost:44316/ 为 Web 应用程序。Each application opens in its own browser tab. https://localhost:44316/ is the web application. https://localhost:44332/ 为 Web API。https://localhost:44332/ is the web API.

  6. 在 Web 应用程序中,单击“注册/登录”以登录到 Web 应用程序。 In the web application, click sign-up / sign-in to sign in to the web application. 使用前面创建的帐户。Use the account that you previously created.

  7. 登录后,单击“待办事项列表”并创建待办事项列表项。 After you sign in, click To-do list and create a to-do list item.

创建待办事项列表项时,Web 应用程序会向 Web API 发起生成待办事项列表项的请求。When you create a to-do list item, the web application makes a request to the web API to generate the to-do list item. 受保护的 Web 应用程序将调用 Azure AD B2C 租户中的受保护 Web API。You're protected web application is calling the protected web API in your Azure AD B2C tenant.

后续步骤Next steps

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

  • 添加 Web API 应用程序Add a web API application
  • 配置 Web API 的范围Configure scopes for a web API
  • 授予 Web API 权限Grant permissions to the web API
  • 将示例配置为使用此应用程序Configure the sample to use the application