Início Rápido: Configurar o início de sessão para uma aplicação ASP.NET com o Azure Active Directory B2C

  • Artigo

O Azure Active Directory B2C (Azure AD B2C) fornece gestão de identidades na cloud para manter a sua aplicação, empresa e clientes protegidos. O Azure AD B2C permite às aplicações fazer a autenticação em contas de redes sociais e contas empresariais, através de protocolos padrão abertos.

Neste início rápido, vai utilizar uma aplicação ASP.NET para iniciar sessão com um fornecedor de identidade de redes sociais e chamar uma API Web protegida pelo Azure AD B2C.

Pré-requisitos

  • Visual Studio 2022 com a carga de trabalho ASP.NET e desenvolvimento Web .

  • Uma conta social do Facebook, Google ou Microsoft.

  • Transfira um ficheiro zip ou clone a aplicação Web de exemplo a partir do GitHub.

    git clone https://github.com/Azure-Samples/active-directory-b2c-dotnet-webapp-and-webapi.git

    Existem dois projetos na solução de exemplo:

    • TaskWebApp - uma aplicação Web que cria e edita uma lista de tarefas. A aplicação Web utiliza o fluxo de utilizador de inscrição ou início de sessão para se inscrever ou iniciar sessão de utilizadores.
    • TaskService - uma API Web que suporta a funcionalidade de criação, leitura, atualização e eliminação da lista de tarefas. A API Web é protegida pelo Azure AD B2C e chamada pela aplicação Web.

Executar a aplicação no Visual Studio

  1. Na pasta de projeto da aplicação de exemplo, abra a solução B2C-WebAPI-DotNet.sln no Visual Studio.

  2. Para este início rápido, vai executar ambos os projetos TaskWebApp e TaskService em simultâneo. Clique com o botão direito do rato na solução B2C-WebAPI-DotNet no Explorador de Soluções e, em seguida, selecione Configurar Projetos de Arranque....

  3. Selecione Vários projetos de arranque e altere a Ação de ambos os projetos para Iniciar.

  4. Selecione OK.

  5. Prima F5 para depurar as duas aplicações. Cada aplicação abre no seu próprio separador do browser:

    • https://localhost:44316/ - aplicação Web ASP.NET. No início rápido, interage diretamente com esta aplicação.
    • https://localhost:44332/ - a API Web que é chamada pela aplicação Web ASP.NET.

Iniciar sessão com a sua conta

  1. Selecione Inscrever-se/Inicie sessão na aplicação Web ASP.NET para iniciar o fluxo de trabalho.

    Captura de ecrã a mostrar o exemplo ASP.NET aplicação Web no browser com a ligação inscrição/inscrição realçada

    O exemplo suporta várias opções de inscrição, incluindo através de um fornecedor de identidade de redes sociais ou criando uma conta local com um endereço de e-mail. Para este início rápido, utilize uma conta de fornecedor de identidade social do Facebook, Google ou Microsoft.

  2. Azure AD B2C apresenta uma página de início de sessão para uma empresa fictícia chamada Fabrikam para a aplicação Web de exemplo. Para se inscrever com um fornecedor de identidade social, selecione o botão do fornecedor de identidade que pretende utilizar.

    Captura de ecrã a mostrar os botões do fornecedor de identidades iniciar sessão ou inscrever-se na página

    Pode autenticar (iniciar sessão) com as credenciais da sua conta social e autorizar a aplicação a ler informações da sua conta social. Ao conceder acesso, a aplicação pode obter as informações do perfil da conta de rede social, como o nome e a localidade.

  3. Conclua o processo de início de sessão para o fornecedor de identidade.

Editar o seu perfil

O Azure Active Directory B2C fornece funcionalidades para permitir que os utilizadores atualizem os seus perfis. A aplicação Web de exemplo utiliza um Azure AD fluxo de utilizador do perfil de edição B2C para o fluxo de trabalho.

  1. Na barra de menus da aplicação, selecione o seu nome de perfil e, em seguida, selecione Editar perfil para editar o perfil que criou.

    Captura de ecrã da aplicação Web de exemplo no browser com a ligação editar perfil realçada

  2. Altere o nome a apresentar ou Cidade e, em seguida, selecione Continuar para atualizar o seu perfil.

    A alteração é apresentada na parte superior direita da home page da aplicação Web.

Aceder a um recurso protegido da API

  1. Selecione To-Do Lista para introduzir e modificar os itens de lista de tarefas.

  2. Na caixa de texto Novo Item , introduza texto. Para chamar a Azure AD API Web protegida por B2C que adiciona um item de lista de tarefas, selecione Adicionar.

    Captura de ecrã a mostrar a aplicação Web de exemplo no browser com a ligação Lista de To-Do e o botão Adicionar realçados.

    O ASP.NET aplicação Web inclui um token de acesso Microsoft Entra no pedido ao recurso protegido da API Web para realizar operações nos itens de lista de tarefas do utilizador.

Utilizou com êxito a sua Azure AD conta de utilizador B2C para efetuar uma chamada autorizada para uma API Web protegida por B2C Azure AD.

Passos seguintes

Criar um inquilino do Azure Active Directory B2C no portal do Azure