Ativar a autenticação na sua própria aplicação Web com Azure AD B2C
Este artigo mostra-lhe como adicionar a autenticação B2C (Azure AD B2C) do Azure Active Directory à sua própria aplicação Web ASP.NET. Saiba como criar uma aplicação Web ASP.NET Core com ASP.NET Core middleware que utiliza o protocolo OpenID Connect.
Utilize este artigo em conjunto com Configurar a autenticação numa aplicação Web de exemplo, substituindo a aplicação Web de exemplo pela sua própria aplicação Web.
Pré-requisitos
Para rever os pré-requisitos e as instruções de integração, veja Configurar a autenticação numa aplicação Web de exemplo.
Passo 1: Criar um projeto de aplicação Web
Pode utilizar um projeto de aplicação Web ASP.NET model-view-controller (MVC) existente ou criar um novo. Para criar um novo projeto, abra uma shell de comandos e, em seguida, introduza o seguinte comando:
dotnet new mvc -o mywebapp
O comando anterior faz o seguinte:
- Cria uma nova aplicação Web MVC.
- O
-o mywebappparâmetro cria um diretório com o nome mywebapp com os ficheiros de origem da aplicação.
Passo 2: Adicionar as bibliotecas de autenticação
Adicione a biblioteca Web de Identidade da Microsoft, que é um conjunto de bibliotecas de ASP.NET Core que simplificam a adição Azure AD suporte de autenticação e autorização B2C à sua aplicação Web. A biblioteca Web de Identidade da Microsoft configura o pipeline de autenticação com autenticação baseada em cookies. Trata-se de enviar e receber mensagens de autenticação HTTP, validação de tokens, extração de afirmações e muito mais.
Para adicionar a biblioteca Web de Identidade da Microsoft, instale os pacotes ao executar os seguintes comandos:
dotnet add package Microsoft.Identity.Web
dotnet add package Microsoft.Identity.Web.UI
Passo 3: Iniciar as bibliotecas de autenticação
O middleware Web de Identidade da Microsoft utiliza uma classe de arranque que é executada quando o processo de alojamento é iniciado. Neste passo, vai adicionar o código necessário para iniciar as bibliotecas de autenticação.
Abra Startup.cs e, em seguida, no início da classe, adicione as seguintes using declarações:
using Microsoft.AspNetCore.Http;
using Microsoft.AspNetCore.Authentication.OpenIdConnect;
using Microsoft.Identity.Web;
using Microsoft.Identity.Web.UI;
Uma vez que a Microsoft Identity Web utiliza a autenticação baseada em cookies para proteger a sua aplicação Web, o código seguinte define as definições de cookies SameSite . Em seguida, lê as definições da aplicação AzureAdB2C e inicia o controlador middleware com a vista.
Substitua a ConfigureServices(IServiceCollection services) função pelo fragmento de código seguinte:
public void ConfigureServices(IServiceCollection services)
{
services.Configure<CookiePolicyOptions>(options =>
{
// This lambda determines whether user consent for non-essential cookies is needed for a given request.
options.CheckConsentNeeded = context => true;
options.MinimumSameSitePolicy = SameSiteMode.Unspecified;
// Handling SameSite cookie according to https://learn.microsoft.com/aspnet/core/security/samesite?view=aspnetcore-3.1
options.HandleSameSiteCookieCompatibility();
});
// Configuration to sign-in users with Azure AD B2C
services.AddMicrosoftIdentityWebAppAuthentication(Configuration, "AzureAdB2C");
services.AddControllersWithViews()
.AddMicrosoftIdentityUI();
services.AddRazorPages();
//Configuring appsettings section AzureAdB2C, into IOptions
services.AddOptions();
services.Configure<OpenIdConnectOptions>(Configuration.GetSection("AzureAdB2C"));
}
O código seguinte adiciona a política de cookies e utiliza o modelo de autenticação. Substitua a Configure função pelo fragmento de código seguinte:
public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
}
else
{
app.UseExceptionHandler("/Home/Error");
// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
app.UseHsts();
}
app.UseHttpsRedirection();
app.UseStaticFiles();
// Add the Microsoft Identity Web cookie policy
app.UseCookiePolicy();
app.UseRouting();
// Add the ASP.NET Core authentication service
app.UseAuthentication();
app.UseAuthorization();
app.UseEndpoints(endpoints =>
{
endpoints.MapControllerRoute(
name: "default",
pattern: "{controller=Home}/{action=Index}/{id?}");
// Add endpoints for Razor pages
endpoints.MapRazorPages();
});
};
Passo 4: Adicionar os elementos da IU
Para adicionar elementos da interface de utilizador, utilize uma vista parcial que contenha lógica para verificar se os utilizadores têm sessão iniciada. Se os utilizadores não irão iniciar sessão, a vista parcial compõe o botão de início de sessão. Se tiverem sessão iniciada, mostra o nome a apresentar e o botão de terminar sessão do utilizador.
Crie um novo ficheiro, _LoginPartial.cshtml, dentro da pasta /Views/Shared com o seguinte fragmento de código:
@using System.Security.Principal
@if (User.Identity.IsAuthenticated)
{
<ul class="nav navbar-nav navbar-right">
<li class="navbar-text">Hello @User.Identity.Name</li>
<!-- The Account controller is not defined in this project. Instead, it is part of Microsoft.Identity.Web.UI nuget package and
it defines some well known actions such as SignUp/In, SignOut and EditProfile-->
<li class="navbar-btn">
<form method="get" asp-area="MicrosoftIdentity" asp-controller="Account" asp-action="EditProfile">
<button type="submit" class="btn btn-primary" style="margin-right:5px">Edit Profile</button>
</form>
</li>
<li class="navbar-btn">
<form method="get" asp-area="MicrosoftIdentity" asp-controller="Account" asp-action="SignOut">
<button type="submit" class="btn btn-primary">Sign Out</button>
</form>
</li>
</ul>
}
else
{
<ul class="nav navbar-nav navbar-right">
<li class="navbar-btn">
<form method="get" asp-area="MicrosoftIdentity" asp-controller="Account" asp-action="SignIn">
<button type="submit" class="btn btn-primary">Sign Up/In</button>
</form>
</li>
</ul>
}
Modifique o ficheiro /Views/Shared_Layout.cshtml para incluir o ficheiro _LoginPartial.cshtml que adicionou. O ficheiro _Layout.cshtml é um esquema comum que proporciona aos utilizadores uma experiência consistente à medida que vão de página em página. O esquema inclui elementos comuns da interface de utilizador, como o cabeçalho e o rodapé da aplicação.
Nota
Dependendo da versão do .NET Core que está a executar e se está a adicionar o início de sessão a uma aplicação existente, os elementos da IU poderão ter um aspeto diferente. Em caso afirmativo, certifique-se de que inclui _LoginPartial na localização adequada no esquema de página.
Abra o ficheiro /Views/Shared/_Layout.cshtml e, em seguida, adicione o seguinte div elemento.
<div class="navbar-collapse collapse">
...
</div>
Substitua este elemento pelo seguinte código do Razor:
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a asp-area="" asp-controller="Home" asp-action="Index">Home</a></li>
<li><a asp-area="" asp-controller="Home" asp-action="Claims">Claims</a></li>
</ul>
<partial name="_LoginPartial" />
</div>
O código do Razor anterior inclui uma ligação para a ação Claims que irá criar no próximo passo.
Passo 5: Adicionar a vista de afirmações
Para ver as afirmações do token de ID, na pasta /Views/Home , adicione a vista Claims.cshtml .
@using System.Security.Claims
@{
ViewData["Title"] = "Claims";
}
<h2>@ViewData["Title"].</h2>
<table class="table-hover table-condensed table-striped">
<tr>
<th>Claim Type</th>
<th>Claim Value</th>
</tr>
@foreach (Claim claim in User.Claims)
{
<tr>
<td>@claim.Type</td>
<td>@claim.Value</td>
</tr>
}
</table>
Neste passo, vai adicionar a ação Claims que liga a vista Claims.cshtml ao controlador Base . A Claims ação utiliza o Authorize atributo, que limita o acesso à ação aos utilizadores autenticados.
No controlador /Controllers/HomeController.cs , adicione a seguinte ação:
[Authorize]
public IActionResult Claims()
{
return View();
}
No início da classe, adicione a seguinte using declaração:
using Microsoft.AspNetCore.Authorization;
Passo 6: Adicionar as definições da aplicação
Azure AD as definições do fornecedor de identidade B2C são armazenadas no ficheiro appsettings.json. Abra appsettings.json e, em seguida, adicione as seguintes definições:
"AzureAdB2C": {
"Instance": "https://<your-tenant-name>.b2clogin.com",
"ClientId": "<web-app-application-id>",
"Domain": "<your-b2c-domain>",
"SignedOutCallbackPath": "/signout-oidc",
"SignUpSignInPolicyId": "<your-sign-up-in-policy>"
}
As informações necessárias são descritas no artigo Configurar autenticação numa aplicação Web de exemplo . Utilize as seguintes definições:
-
Instância: substitua
<your-tenant-name>pela primeira parte do Azure AD nome do inquilino B2C (por exemplo,https://contoso.b2clogin.com). -
Domínio: substitua pelo
<your-b2c-domain>nome de inquilino completo Azure AD B2C (por exemplo,contoso.onmicrosoft.com). -
ID do Cliente: substitua
<web-app-application-id>pelo ID da Aplicação do Passo 2. -
Nome da política: substitua pelos
<your-sign-up-in-policy>fluxos de utilizador que criou no Passo 1.
Passo 7: Executar a sua aplicação
- Crie e execute o projeto.
- Aceda a
https://localhost:5001. - Selecione Inscrever-se/Iniciar Sessão.
- Conclua o processo de inscrição ou início de sessão.
Depois de ser autenticado com êxito, verá o seu nome a apresentar na barra de navegação. Para ver as afirmações que o token Azure AD B2C devolve à sua aplicação, selecione Afirmações.