Português (Portugal)
  • asp-net-core
  • c-sharp
  • tutorial
  • auth
  • authentication
  • oauth
  • oidc
  • identity

Construir autenticação ASP.NET Core com Logto

Aprenda como construir um fluxo de autenticação de usuário com ASP.NET Core ao integrar o SDK do Logto.

Gao
Gao
Founder

Introdução

  • Logto é uma alternativa moderna ao Auth0 para a construção de infraestrutura de identidade do cliente com o mínimo esforço. Ele suporta vários métodos de login, incluindo nome de usuário, e-mail, número de telefone e logins sociais populares, como Google e GitHub.
  • ASP.NET Core é um framework de código aberto, multiplataforma e de alto desempenho para a criação de aplicações modernas conectadas à Internet e baseadas na nuvem.

Neste tutorial, mostraremos como construir um fluxo de autenticação de usuário com ASP.NET Core ao integrar o SDK do Logto. O tutorial utiliza C# como a linguagem de programação.

Pré-requisitos

Antes de começar, certifique-se de ter o seguinte:

Criar uma aplicação Logto

Para começar, crie uma aplicação Logto com o tipo "Web tradicional". Siga estes passos para criar uma aplicação Logto:

  1. Faça login no Console Logto.
  2. Na barra de navegação à esquerda, clique em Aplicações.
  3. Clique em Criar aplicação.
  4. Na página aberta, encontre a seção "Aplicativo web tradicional" e localize o cartão "ASP.NET Core".
  5. Clique em Começar a construir e insira o nome da sua aplicação.
  6. Clique em Criar.

Então você deve ver um tutorial interativo que o guia pelo processo de integração do SDK Logto com a sua aplicação ASP.NET Core. O conteúdo a seguir pode ser uma referência para uso futuro.

Tente o tutorial interativo do Logto Cloud

Integre com o SDK Logto

Instalação

Observe que a versão mínima suportada do ASP.NET Core é 6.0.

Adicionando o middleware de autenticação Logto

Abra Startup.cs (ou Program.cs) e adicione o seguinte código para registrar o middleware de autenticação Logto:

O método AddLogtoAuthentication fará as seguintes coisas:

  • Definirá o esquema de autenticação padrão para LogtoDefaults.CookieScheme.
  • Definirá o esquema de desafio padrão como LogtoDefaults.AuthenticationScheme.
  • Definirá o esquema de logout padrão para LogtoDefaults.AuthenticationScheme.
  • Adicionará manipuladores de autenticação de cookies e OpenID Connect ao esquema de autenticação.

Login

Adicione o seguinte URI à lista de Redirect URIs na página de detalhes da aplicação Logto:

Para entrar com o Logto, você pode usar o método ChallengeAsync:

O método ChallengeAsync redirecionará o usuário para a página de login do Logto.

A Propriedade RedirectUri é usada para redirecionar o usuário de volta para sua aplicação web após a autenticação. Observe que é diferente do URI de redirecionamento que você configurou na página de detalhes da aplicação Logto:

  1. O URI de redirecionamento na página de detalhes da aplicação Logto é o URI para o qual o Logto irá redirecionar o usuário após o login.
  2. A propriedade RedirectUri é o URI para o qual será redirecionado após as ações necessárias terem sido realizadas no middleware de autenticação Logto.

A ordem das ações é 1 -> 2. Para maior clareza, chamaremos o URI de redirecionamento na página de detalhes da aplicação Logto de URI de redirecionamento Logto e a propriedade RedirectUri de URI de redirecionamento da aplicação.

O URI de redirecionamento Logto tem um valor padrão de /Callback, que você pode deixar como está se não tiver nenhum requisito especial. Se desejar alterá-lo, você pode definir a propriedade CallbackPath para LogtoOptions:

Lembre-se de atualizar o valor na página de detalhes da aplicação Logto adequadamente.

Logout

Adicione o seguinte URI à lista Post log out redirect URIs na página de detalhes da aplicação Logto:

Para sair com o Logto, você pode usar o método SignOutAsync:

O método SignOutAsync irá limpar o cookie de autenticação e redirecionar o usuário para a página de saída do Logto.

A propriedade RedirectUri é utilizada para redirecionar o usuário de volta para a sua aplicação web após o logout. Observe que é diferente do URI de redirecionamento pós logout que você configurou na página de detalhes da aplicação Logto:

  1. O URI de redirecionamento pós logout na página de detalhes da aplicação Logto é o URI para o qual o Logto irá redirecionar o usuário após o logout.
  2. A propriedade RedirectUri é o URI para o qual será redirecionado após as ações necessárias terem sido realizadas no middleware de autenticação Logto.

A ordem das ações é 1 -> 2. Para maior clareza, chamaremos o URI de redirecionamento pós logout na página de detalhes da aplicação Logto de URI de redirecionamento pós logout do Logto e a propriedade RedirectUri de URI de redirecionamento pós logout da aplicação.

O URI de redirecionamento pós logout do Logto tem um valor padrão de /SignedOutCallback, que você pode deixar como está se não houver nenhum requisito especial. Se quiser alterá-lo, você pode definir a propriedade SignedOutCallbackPath para LogtoOptions:

Lembre-se de atualizar o valor na página de detalhes da aplicação Logto adequadamente.

Implementar botões de login/logout (Razor Pages)

Primeiro, adicione os métodos de manipulação ao seu PageModel, por exemplo:

Em seguida, adicione os botões à sua página Razor (html):

<p>Está autenticado: @User.Identity?.IsAuthenticated</p>
<form method="post">
  @if (User.Identity?.IsAuthenticated == true)
  {
    <button type="submit" asp-page-handler="SignOut">Sair</button>
  } else {
    <button type="submit" asp-page-handler="SignIn">Entrar</button>
  }
</form>

Ele mostrará o botão "Entrar" se o usuário não estiver autenticado, e mostrará o botão "Sair" se o usuário estiver autenticado.

Verificação: Execute a aplicação web

Agora você pode executar a aplicação web e tentar entrar/sair com o Logto:

  1. Abra a aplicação web no seu navegador, você deve ver "Está autenticado: False" e o botão "Entrar".
  2. Clique no botão "Entrar", e você deve ser redirecionado para a página de login do Logto.
  3. Depois de ter entrado, você deve ser redirecionado de volta para a aplicação web, e você deve ver "Está autenticado: True" e o botão "Sair".
  4. Clique no botão "Sair", e você deve ser redirecionado para a página de saída do Logto, e então redirecionado de volta para a aplicação web.

Se encontrou algum problema durante a integração, não hesite em nos contatar pelo e-mail [email protected] ou junte-se ao nosso servidor no Discord!

Leituras adicionais

Tente o Logto Hoje