Conectar usuários em um aplicativo Web de exemplo Python Django.

Neste guia, você irá explorar um aplicativo Web Python Django que é protegido pela ID externa do Microsoft Entra. Esse exemplo o conduz pela experiência de entrada para clientes que se autenticam em um aplicativo Web Python Django. O aplicativo Web de amostra usa a Biblioteca de Autenticação da Microsoft para Python (MSAL Python) para lidar com a autenticação do usuário.

Pré-requisitos

• Visual Studio Code ou outro editor de código.
• Python 3+.
• Um locatário externo. Para criar um, você pode utilizar um dos seguintes métodos:
  • (Recomendado) Use a extensão de ID Externa do Microsoft Entra para configurar um locatário externo diretamente no Visual Studio Code.
  • Crie um novo locatário externo no centro de administração do Microsoft Entra.

Registrar o aplicativo Web

Para permitir a entrada de usuários com o Microsoft Entra no seu aplicativo, a ID externa do Microsoft Entra deve estar ciente do aplicativo criado. O registro do aplicativo estabelece uma relação de confiança entre o aplicativo e o Microsoft Entra. Quando você registra um aplicativo, o External ID gera um identificador exclusivo conhecido como ID do Aplicativo (cliente), um valor usado para identificar seu aplicativo ao criar solicitações de autenticação.

As etapas a seguir mostram como registrar seu aplicativo no centro de administração do Microsoft Entra:

1. Faça login no Centro de administração do Microsoft Entra como pelo menos um Desenvolvedor de aplicativos.

2. Se tiver acesso a vários locatários, use o ícone Configurações no menu superior para alternar para o seu locatário externo no menu Diretórios + assinaturas.

3. Navegue até Identidade>Aplicativos>Registros do aplicativo.

4. Selecione + Novo Registro.

5. Na página Registrar um aplicativo que aparece;

   1. Insira um Nome de aplicativo relevante que será exibido aos usuários do aplicativo, por exemplo,ciam-client-app.
   2. Em Tipos de contas com suporte, selecione Contas somente neste diretório organizacional.

6. Selecione Registrar.

7. O painel Visão geral do aplicativo será exibido após o registro bem-sucedido. Grave a ID do aplicativo (cliente) que será usada no código-fonte do aplicativo.

Para especificar o tipo de aplicativo para o registro do aplicativo, siga estas etapas:

1. Em Gerenciar, selecione Autenticação
2. Na página de Configurações da plataforma, selecione Adicionar uma plataforma e, em seguida, selecione a opção Web.
3. Para o Redirecionamento de URIs, insira http://localhost:5000/redirect. Esse URI de redirecionamento é o local para onde o servidor de autorização envia o token de acesso. Você pode personalizá-lo para se adequar ao seu caso de uso.
4. Selecione Configurar para salvar as alterações.

Adicionar segredo do cliente do aplicativo

Crie um segredo do cliente para o aplicativo registrado. O aplicativo usa o segredo do cliente para confirmar sua identidade ao solicitar tokens.

1. Na página Registros de aplicativo, selecione o aplicativo que você criou (como ciam-client-app) para abrir sua página Visão geral.
2. Em Gerenciar, selecione Certificados e segredos.
3. Selecione Novo segredo do cliente.
4. Na caixa Descrição, insira uma descrição para o segredo do cliente (por exemplo, ciam app client secret).
5. Em Expira, selecione o período pelo qual o segredo será válido (conforme as regras de segurança da sua organização) e selecione Adicionar.
6. Registre o Valor do segredo. Você usará esse valor para uma configuração em uma etapa posterior. O valor secreto não será exibido novamente e não poderá ser recuperado de forma nenhuma depois que você sair dos Certificados e segredos. Certifique-se de registrá-lo.

Conceder consentimento do administrador

Depois de registrar seu aplicativo, ele recebe a permissão User.Read. No entanto, como o locatário é externo, os próprios usuários clientes não podem consentir com esta permissão. Você, como administrador, deve consentir com essa permissão em nome de todos os usuários no locatário:

1. Na página Registros de aplicativo, selecione o aplicativo que você criou (como ciam-client-app) para abrir sua página Visão geral.

2. Em Gerenciar, selecione Permissões de API.

   1. Selecione Dar consentimento de administrador para <nome do seu locatário> e selecione Sim.
   2. Selecione Atualizar e verifique se Concedido para <nome do seu locatário> aparece em Status para a permissão.

Criar um fluxo de usuário

Siga estas etapas para criar um fluxo de usuário que um cliente possa usar para entrar ou se inscrever em um aplicativo.

1. Entre no Centro de administração do Microsoft Entra como pelo menos um Administrador de fluxo de usuário de ID externa.

2. Se você tiver acesso a vários locatários, use o ícone Configurações no menu superior para alternar para seu locatário externo no menu Diretórios + assinaturas.

3. Navegue atéIdentidade>Identidades Externas>Fluxos do Usuário.

4. Selecione + Novo fluxo de usuário.

5. Na página Criar:

   1. Insira um Nome para o fluxo de usuário, como SignInSignUpSample.

   2. Na lista Provedores de identidade, selecione Contas de Email. Esse provedor de identidade permite que os usuários entrem ou se inscrevam usando seu endereço de email.

      Observação

      Provedores de identidade adicionais serão listados aqui somente depois que você configurar a federação com eles. Por exemplo, se você configurar a federação com o Google ou com o Facebook, poderá selecionar esses provedores de identidade adicionais aqui.

   3. Em Contas de email, você pode selecionar uma das duas opções. Para este tutorial, selecione Email com senha.

      • Email com senha: permite que novos usuários se inscrevam e entrem usando um endereço de email como o nome de entrada e uma senha como sua credencial de primeiro fator.
      • Senha de uso único do email: permite que novos usuários se inscrevam e entrem usando um endereço de email como o nome de entrada e a senha de uso único de email como a credencial de primeiro fator. A senha de uso único de email deve estar habilitada no nível do locatário (Todos os Provedores de Identidade>Senha de uso único de email) para essa opção ficar disponível no nível do fluxo do usuário.

   4. Em Atributos de usuário, escolha os atributos que você deseja coletar do usuário no momento da inscrição. Ao selecionar Mostrar mais, você pode escolher atributos e declarações para País/Região, Nome de Exibição e Código Postal. Selecione OK. (Os usuários só são solicitados a fornecer atributos quando se inscreverem pela primeira vez.)

6. Selecione Criar. O novo fluxo de usuário aparece na lista Fluxos de usuário. Se necessário, atualize a página.

Para habilitar a redefinição de senha self-service, use as etapas no artigo Habilitar redefinição de senha self-service.

Associe o aplicativo Web ao fluxo do usuário

Para que os usuários do cliente vejam a experiência de inscrição ou entrada ao usar seu aplicativo, você precisa associar seu aplicativo a um fluxo de usuário. Embora muitos aplicativos possam estar associados ao fluxo do usuário, um único aplicativo só pode estar associado a um único fluxo do usuário.

1. No menu da barra lateral, selecione Identidade.

2. Selecione Identidades Externas e Fluxos de usuário.

3. Na página Fluxos de usuário, selecione o Nome do fluxo de usuário criado anteriormente, por exemplo, SignInSignUpSample.

4. Em Usar, selecione Aplicativos.

5. Escolha Adicionar aplicativo.

6. Selecione o aplicativo na lista, como ciam-client-app, ou use a caixa de pesquisa para localizar o aplicativo e selecioná-lo.

7. Escolha Selecionar.

Depois de associar o aplicativo a um fluxo de usuário, é possível testar o fluxo de usuário simulando a experiência de inscrição ou entrada de um usuário com o aplicativo no centro de administração do Microsoft Entra. Para fazer isso, use as etapas em Testar seu fluxo de usuário de inscrição e entrada.

Clonar ou baixar o aplicativo Web de exemplo

Para obter o aplicativo de exemplo, você pode cloná-lo do GitHub ou baixá-lo como um arquivo .zip.

• Para clonar o exemplo, abra um prompt de comando e navegue até onde deseja criar o projeto e insira o seguinte comando:

  git clone https://github.com/Azure-Samples/ms-identity-docs-code-python.git
  

• Baixar o arquivo .zip. Extraia-o para um caminho de arquivo em que o comprimento do nome seja menor que 260 caracteres.

Instalar as dependências do projeto

1. Abra uma janela do console e altere para o diretório que contém o aplicativo Web de amostra do Flask:

   cd django-web-app
   

2. Configurar o ambiente virtual

   • Windows
   • macOS/Linux

   py -m venv .venv
   .venv\scripts\activate
   

3. Execute os seguintes comandos para instalar as dependências do aplicativo:

   python3 -m pip install -r requirements.txt
   

Configurar o aplicativo Web de exemplo

1. Abra os arquivos do projeto no Visual Studio Code ou no editor que você está usando.

2. Crie um arquivo .env na pasta raiz do projeto usando o arquivo .env.sample como guia.

3. Em seu arquivo .env, forneça as seguintes variáveis de ambiente:

   1. CLIENT_ID, que é a ID do aplicativo (cliente) que você registrou anteriormente.
   2. CLIENT_SECRET, que é o valor secreto do aplicativo que você copiou anteriormente.
   3. AUTHORITY que é a URL que identifica uma autoridade de token. Ele deve ter o formato https://{subdomínio}.ciamlogin.com/{subdomínio}.onmicrosoft.com. Substitua o subdomínio pelo subdomínio do diretório (locatário). Por exemplo, se o domínio primário do locatário for contoso.onmicrosoft.com, use contoso. Se você não tiver o subdomínio do locatário, saiba como ler os detalhes do locatário.
   4. REDIRECT_URI, que deve ser semelhante ao URI de redirecionamento registrado anteriormente, deve corresponder à sua configuração.

Executar e testar o aplicativo Web de exemplo

Execute o aplicativo para ver a experiência de entrada em execução.

1. No terminal, execute o seguinte comando:

   python manage.py runserver localhost:5000                                             
   

   Você pode usar a porta de sua escolha. Ela deve ser semelhante à porta do URI de redirecionamento que você registrou anteriormente.

2. Abra seu navegador e acesse http://localhost:5000. Você deverá ver a página semelhante à seguinte captura de tela:

   

3. Após a conclusão do carregamento da página, selecione o link Entrar. Você é solicitado a fazer login.

4. Na página de entrada, digite seu Endereço de email, selecione Avançar, digite sua Senha e selecione Entrar. Se você não tiver uma conta, selecione o link Não tem uma conta? Crie uma, que iniciará o fluxo de inscrição.

5. Se escolher a opção de inscrição, você passará pelo fluxo de inscrição. Preencha seu email, a senha de uso único, a nova senha e outros detalhes da conta para concluir todo o fluxo de registro.

6. Depois de entrar ou se inscrever, você será redirecionado de volta ao aplicativo Web. Você verá uma página semelhante à seguinte captura de tela:

   

7. Selecione Logoff para desconectar o usuário do aplicativo Web ou selecione Chamar uma API downstream para fazer uma chamada para um ponto de extremidade do Microsoft Graph.

Como ele funciona

Quando os usuários selecionam o link Entrar, o aplicativo inicia uma solicitação de autenticação e redireciona os usuários para a Identidade Externa do Microsoft Entra. Em seguida, o usuário entrará ou se inscreverá na página que aparece. Depois de fornecer as credenciais necessárias e consentir com os escopos necessários, a ID externa do Microsoft Entra redireciona o usuário de volta ao aplicativo Web com um código de autorização. Em seguida, o aplicativo Web usa esse código de autorização para adquirir um token da ID externa do Microsoft Entra.

Quando os usuários selecionam o link Logoff , o aplicativo limpa sua sessão e redireciona o usuário para o ponto de extremidade de saída da ID externa do Microsoft Entra para notificar que o usuário saiu. O usuário é então redirecionado de volta para o aplicativo Web.

Conteúdo relacionado

• Conectar usuários usando um aplicativo Web Flask de amostra
• Habilitar a redefinição de senha
• Personalizar a identidade visual padrão
• Configurar a entrada com o Google