Guia de início rápido: iniciar sessão de utilizadores em um aplicativo Web de exemplo

Aplica-se a: Inquilinos da força de trabalho Inquilinos externos (saiba mais)

Neste início rápido, tu usas uma aplicação web de exemplo para mostrar como autenticar utilizadores e chamar a API do Microsoft Graph no teu inquilino de trabalho. A aplicação de exemplo usa a Biblioteca de Autenticação da Microsoft para manipular a autenticação.

Antes de começar, use o seletor Escolha um tipo de inquilino na parte superior desta página para selecionar o tipo de inquilino. O Microsoft Entra ID fornece duas configurações de tenant: força de trabalho e externo. Uma configuração para a força de trabalho é para os seus funcionários, aplicativos internos e outros recursos organizacionais. Um locatário externo é para os seus aplicativos voltados para o cliente.

Pré-requisitos

• Uma conta do Azure com uma assinatura ativa. Se ainda não tiver uma, Crie uma conta gratuitamente.
• Essa conta do Azure deve ter permissões para gerenciar aplicativos. Qualquer uma das seguintes funções do Microsoft Entra inclui as permissões necessárias:
  • Administrador de aplicativos
  • Programador de Aplicações
• Habitação para trabalhadores. Você pode usar seu diretório padrão ou configurar um novo locatário.
• Visual Studio Code ou outro editor de código.

Nó

• Registre um novo aplicativo no centro de administração do Microsoft Entra, configurado para Contas somente neste diretório organizacional. Consulte Registar uma candidatura para obter mais detalhes. Registre os seguintes valores na página Visão geral do aplicativo para uso posterior:
  • ID da aplicação (cliente)
  • ID do diretório (inquilino)
• Adicione os seguintes URIs de redirecionamento usando a configuração da plataforma Web . Consulte Como adicionar um URI de redirecionamento em seu aplicativo para obter mais detalhes.
  • Redirecionar URI: http://localhost:3000/auth/redirect
  • URL de término de sessão do canal frontal: https://localhost:5001/signout-callback-oidc
• Adicione um segredo de cliente ao registro do seu aplicativo. Não use segredos de cliente em aplicativos de produção. Em vez disso, use certificados ou credenciais federadas. Para obter mais informações, consulte Adicionar credenciais ao seu aplicativo.
• Node.js

ASP.NET Núcleo

• Registre um novo aplicativo no centro de administração do Microsoft Entra, configurado para Contas somente neste diretório organizacional. Consulte Registar uma candidatura para obter mais detalhes. Registre os seguintes valores na página Visão geral do aplicativo para uso posterior:
  • ID da aplicação (cliente)
  • ID do diretório (inquilino)
• Adicione os seguintes URIs de redirecionamento usando a configuração da plataforma Web . Consulte Como adicionar um URI de redirecionamento em seu aplicativo para obter mais detalhes.
  • Redirecionar URI: https://localhost:5001/signin-oidc
  • URL de término de sessão do canal frontal: https://localhost:5001/signout-callback-oidc
• Adicione um certificado autoassinado ao registro do aplicativo. Não use certificados autoassinados em aplicativos de produção. Em vez disso, use um certificado de uma autoridade de certificação confiável ou credenciais federadas. Para obter mais informações, consulte Adicionar credenciais ao seu aplicativo. Crie o certificado usando o seguinte comando:

  dotnet dev-certs https -ep ./certificate.crt --trust
  

• Um requisito mínimo de SDK .NET 8.0

Python Flask

• Registre um novo aplicativo no centro de administração do Microsoft Entra, configurado para Contas somente neste diretório organizacional. Consulte Registar uma candidatura para obter mais detalhes. Registre os seguintes valores na página Visão geral do aplicativo para uso posterior:
  • ID da aplicação (cliente)
  • ID do diretório (inquilino)
• Adicione os seguintes URIs de redirecionamento usando a configuração da plataforma Web . Consulte Como adicionar um URI de redirecionamento em seu aplicativo para obter mais detalhes.
  • Redirecionar URI: http://localhost:5000/getAToken
• Python 3 +
• Adicione um segredo de cliente ao registro do seu aplicativo. Não use segredos de cliente em aplicativos de produção. Em vez disso, use certificados ou credenciais federadas. Para obter mais informações, consulte Adicionar credenciais ao seu aplicativo.

Clone ou baixe um aplicativo Web de exemplo

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

Nó

• Baixe o arquivo .zipe, em seguida, extraia-o para um caminho de arquivo onde o comprimento do nome é inferior a 260 caracteres ou clone o repositório:

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

  git clone https://github.com/Azure-Samples/ms-identity-node.git
  

ASP.NET Núcleo

• Baixe o arquivo .zipe, em seguida, extraia-o para um caminho de arquivo onde o comprimento do nome é inferior a 260 caracteres ou clone o repositório:

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

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

Python Flask

• Baixe o exemplo de código Python extraia-o para um caminho de arquivo onde o comprimento do nome é inferior a 260 caracteres ou clone o repositório:

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

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

Configurar o aplicativo Web de exemplo

Para que possa iniciar sessão os utilizadores com a aplicação de exemplo, tem de atualizá-la com a sua aplicação e os detalhes do locatário.

Nó

Na pasta ms-identity-node, abra o ficheiro App/.env e substitua os espaços reservados seguintes:

Variável	Descrição	Exemplo(s)
Enter_the_Cloud_Instance_Id_Here	A instância de nuvem do Azure na qual seu aplicativo está registrado	https://login.microsoftonline.com/ (incluir a barra diagonal final)
Enter_the_Tenant_Info_here	ID do locatário ou domínio primário	contoso.microsoft.com ou aaaabbbb-0000-cccc-1111-dddd2222eeee
Enter_the_Application_Id_Here	ID de cliente da aplicação que registou	00001111-aaaa-2222-bbbb-3333cccc4444
Enter_the_Client_Secret_Here	Segredo do cliente da aplicação que você registou	A1b-C2d_E3f.H4i,J5k?L6m!N7o-P8q_R9s.T0u
Enter_the_Graph_Endpoint_Here	A instância de nuvem da API do Microsoft Graph que seu aplicativo chama	https://graph.microsoft.com/ (incluir a barra diagonal final)
Enter_the_Express_Session_Secret_Here	Uma sequência aleatória de caracteres usada para assinar o cookie de sessão Express	A1b-C2d_E3f.H4...

Depois de fazer alterações, o arquivo deve ser semelhante ao seguinte trecho:

CLOUD_INSTANCE=https://login.microsoftonline.com/
TENANT_ID=aaaabbbb-0000-cccc-1111-dddd2222eeee
CLIENT_ID=00001111-aaaa-2222-bbbb-3333cccc4444
CLIENT_SECRET=A1b-C2d_E3f.H4...

REDIRECT_URI=http://localhost:3000/auth/redirect
POST_LOGOUT_REDIRECT_URI=http://localhost:3000

GRAPH_API_ENDPOINT=https://graph.microsoft.com/

EXPRESS_SESSION_SECRET=6DP6v09eLiW7f1E65B8k

ASP.NET Núcleo

1. No IDE, abra a pasta do projeto ms-identity-docs-code-dotnet\web-app-aspnet, que contém o exemplo.

2. Abra appsettings.json e substitua o conteúdo do arquivo pelo seguinte trecho;

   {
   "AzureAd": {
     "Instance": "https://login.microsoftonline.com/",
     "TenantId": "Enter the tenant ID obtained from the Microsoft Entra admin center",
     "ClientId": "Enter the client ID obtained from the Microsoft Entra admin center",
     "ClientCredentials": [
       {
         "SourceType": "StoreWithThumbprint",
         "CertificateStorePath": "CurrentUser/My",
         "CertificateThumbprint": "Enter the certificate thumbprint obtained the Microsoft Entra admin center"
       }   
     ],
     "CallbackPath": "/signin-oidc"
   },
     "DownstreamApis": {
       "MicrosoftGraph" :{
         "BaseUrl": "https://graph.microsoft.com/v1.0/",
         "RelativePath": "me",
         "Scopes": [ 
           "user.read" 
         ]
      }
     },
     "Logging": {
       "LogLevel": {
         "Default": "Information",
         "Microsoft.AspNetCore": "Warning"
       }
     },
     "AllowedHosts": "*"
   }
   

   • TenantId - O identificador do locatário onde o aplicativo está registrado. Substitua o texto entre aspas pelo Directory (tenant) ID que foi registrado anteriormente na página de visão geral do aplicativo registrado.
   • ClientId - O identificador do aplicativo, também conhecido como cliente. Substitua o texto entre aspas pelo valor Application (client) ID que foi registrado anteriormente na página de visão geral do aplicativo registrado.
   • ClientCertificates - Um certificado autoassinado é usado para autenticação no aplicativo. Substitua o texto do CertificateThumbprint pela impressão digital do certificado que já foi registada.

Python Flask

1. Abra o aplicativo que você baixou em um IDE e navegue até a pasta raiz do aplicativo de exemplo.

   cd flask-web-app
   

2. Crie um arquivo .env na pasta raiz do projeto usando .env.sample.entra-id como guia.

   # The following variables are required for the app to run.
   CLIENT_ID=<Enter_your_client_id>
   CLIENT_SECRET=<Enter_your_client_secret>
   AUTHORITY=<Enter_your_authority_url>
   

   • Defina o valor de CLIENT_ID para o ID de Aplicação (cliente) para a aplicação registada, disponível na página de visão geral.
   • Defina o valor de CLIENT_SECRET para o segredo do cliente que você criou no Certificados & Segredos para o aplicativo registrado.
   • Defina o valor de AUTHORITY como um https://login.microsoftonline.com/<TENANT_GUID>. O ID do Diretório (locatário) está disponível na página de visão geral da inscrição da aplicação.

   As variáveis de ambiente são referenciadas em app_config.pye são mantidas em um arquivo de .env separado para mantê-las fora do controle do código-fonte. O arquivo fornecido .gitignore impede que o ficheiro .env seja adicionado ao repositório.

Executar e testar aplicativo Web de exemplo

Você configurou seu aplicativo de exemplo. Você pode continuar a executá-lo e testá-lo.

Nó

1. Para iniciar o servidor, execute os seguintes comandos de dentro do diretório do projeto:

   cd App
   npm install
   npm start
   

2. Vá para http://localhost:3000/.

3. Selecione Iniciar sessão para iniciar o processo de início de sessão.

Na primeira vez que iniciar sessão, ser-lhe-á pedido que forneça o seu consentimento para permitir que a aplicação inicie sessão e aceda ao seu perfil. Depois de iniciar sessão com êxito, será redirecionado de volta para a página inicial da aplicação.

Como funciona a aplicação

O exemplo hospeda um servidor Web no localhost, porta 3000. Quando um navegador da Web acessa esse endereço, o aplicativo renderiza a página inicial. Assim que o utilizador seleciona Entrar, a aplicação redireciona o navegador para a página de entrada do Microsoft Entra através da URL gerada pela biblioteca MSAL Node. Após o consentimento do usuário, o navegador redireciona o usuário de volta para a página inicial do aplicativo, juntamente com um ID e token de acesso.

ASP.NET Núcleo

1. No diretório do projeto, use o terminal para inserir os seguintes comandos:

   cd ms-identity-docs-code-dotnet/web-app-aspnet
   dotnet run
   

2. Copie o URL https que aparece no terminal, por exemplo, https://localhost:5001e cole-o em um navegador. Recomendamos o uso de uma sessão privada ou anônima do navegador.

3. Siga os passos e introduza os detalhes necessários para iniciar sessão com a sua conta Microsoft. É-lhe pedido que forneça um endereço de e-mail para que lhe possa ser enviado um código de acesso único. Insira o código quando solicitado.

4. A aplicação solicita permissão para manter o acesso aos dados aos quais lhe deu acesso, para iniciar sessão e ler o seu perfil. Selecione Aceitar. A captura de tela a seguir é exibida. Ele indica que você está conectado ao aplicativo e está exibindo os detalhes do seu perfil a partir da API do Microsoft Graph.

   

Sair do aplicativo

1. Encontre o link Sair no canto superior direito da página e selecione-o.
2. Você será solicitado a escolher uma conta da qual sair. Selecione a conta que utilizou para iniciar sessão.
3. Uma mensagem é exibida indicando que você saiu. Agora você pode fechar a janela do navegador.

Python Flask

1. Crie um ambiente virtual para o aplicativo:

   • Para Windows, execute os seguintes comandos:

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

   • Para macOS/Linux, execute os seguintes comandos:

   python3 -m venv .venv
   source .venv/bin/activate
   

2. Instale os requisitos usando pip:

   pip install -r requirements.txt
   

3. Execute o aplicativo a partir da linha de comando. Verifique se seu aplicativo está sendo executado na mesma porta que o URI de redirecionamento configurado anteriormente.

   flask run --debug --host=localhost --port=5000
   

4. Copie o URL https que aparece no terminal, por exemplo, https://localhost:5000e cole-o em um navegador. Recomendamos o uso de uma sessão privada ou anônima do navegador.

5. Siga os passos e introduza os detalhes necessários para iniciar sessão com a sua conta Microsoft. É-lhe pedido que forneça um endereço de e-mail e uma palavra-passe para iniciar sessão.

6. O aplicativo solicita permissão para manter o acesso aos dados aos quais você permite acessar, fazer login e ler seu perfil, conforme mostrado na captura de tela. Selecione Aceitar.

   

7. A captura de tela a seguir é exibida, indicando que você entrou com êxito no aplicativo.

Como funciona a aplicação

O diagrama a seguir demonstra como o aplicativo de exemplo funciona:

1. O aplicativo usa o pacote identity para obter um token de acesso da plataforma de identidade da Microsoft. Este pacote foi criado sobre a Microsoft Authentication Library (MSAL) para Python para simplificar a autenticação e a autorização em aplicativos Web.

2. O token de acesso obtido na etapa anterior é usado como um token de portador para autenticar o usuário ao chamar a API do Microsoft Graph.

Conteúdo relacionado

Nó

• Saiba como criar uma app Web Node.js que faz login nos utilizadores e chama a API do Microsoft Graph em . Tutorial: Inicie sessão para utilizadores e obtenha um token para o Microsoft Graph numa app Web Node.js & Express.

ASP.NET Núcleo

• Aprenda criando este aplicativo Web ASP.NET com a série Tutorial: Registrar um aplicativo com a plataforma de identidade da Microsoft.
• Início Rápido: Proteja uma API Web ASP.NET Core com a plataforma de identidade da Microsoft.
• Guia de início rápido: implantar um aplicativo Web ASP.NET no Serviço de Aplicativo do Azure

Python Flask

• Saiba como criar uma aplicação Web em Python que autentica utilizadores e acede a uma API da Web protegida em Tutorial: Aplicação Web que autentica utilizadores.

Neste guia de início rápido, você usa um aplicativo Web de exemplo para mostrar como autenticar utilizadores no seu inquilino externo. A aplicação de exemplo usa a Biblioteca de Autenticação da Microsoft para manipular a autenticação.

Antes de começar, use o seletor Escolha um tipo de inquilino na parte superior desta página para selecionar o tipo de inquilino. O Microsoft Entra ID fornece duas configurações de tenant: força de trabalho e externo. Uma configuração para a força de trabalho é para os seus funcionários, aplicativos internos e outros recursos organizacionais. Um locatário externo é para os seus aplicativos voltados para o cliente.

Pré-requisitos

• Uma conta do Azure com uma assinatura ativa. Se ainda não tiver uma, Crie uma conta gratuitamente.
• Essa conta do Azure deve ter permissões para gerenciar aplicativos. Qualquer uma das seguintes funções do Microsoft Entra inclui as permissões necessárias:
  • Administrador de aplicativos
  • Programador de Aplicações
• Um locatário externo. Para criar um, escolha um dos seguintes métodos:
  • Use a extensão de ID Externa do Microsoft Entra para configurar um locatário externo diretamente no Visual Studio Code. (Recomendado)
  • Crie um novo locatário externo no centro de administração do Microsoft Entra.
• Um fluxo de usuários. Para obter mais informações, consulte criar fluxos de adesão em regime de autoatendimento para aplicações em inquilinos externos. Esse fluxo de usuário pode ser usado para vários aplicativos.
• Visual Studio Code ou outro editor de código.

Nó

• Registre um novo aplicativo no centro de administração do Microsoft Entra, configurado para Contas somente neste diretório organizacional. Consulte Registar uma candidatura para obter mais detalhes. Registre os seguintes valores na página Visão geral do aplicativo para uso posterior:
  • ID da aplicação (cliente)
  • ID do diretório (inquilino)
• Adicione os seguintes URIs de redirecionamento usando a configuração da plataforma Web . Consulte Como adicionar um URI de redirecionamento em seu aplicativo para obter mais detalhes.
  • Redirecionar URI: http://localhost:3000/auth/redirect
  • URL de término de sessão do canal frontal: https://localhost:5001/signout-callback-oidc
• Adicione um segredo de cliente ao registro do seu aplicativo. Não use segredos de cliente em aplicativos de produção. Em vez disso, use certificados ou credenciais federadas. Para obter mais informações, consulte Adicionar credenciais ao seu aplicativo.
• Adicione seu aplicativo ao fluxo de usuários
• Node.js

ASP.NET Núcleo

• Registre um novo aplicativo no centro de administração do Microsoft Entra, configurado para Contas somente neste diretório organizacional. Consulte Registar uma candidatura para obter mais detalhes. Registre os seguintes valores na página Visão geral do aplicativo para uso posterior:
  • ID da aplicação (cliente)
  • ID do diretório (inquilino)
• Adicione os seguintes URIs de redirecionamento usando a configuração da plataforma Web . Consulte Como adicionar um URI de redirecionamento em seu aplicativo para obter mais detalhes.
  • Redirecionar URI: https://localhost:5001/signin-oidc
  • URL de término de sessão do canal frontal: https://localhost:5001/signout-callback-oidc
• Adicione um segredo de cliente ao registro do seu aplicativo. Não use segredos de cliente em aplicativos de produção. Em vez disso, use certificados ou credenciais federadas. Para obter mais informações, consulte Adicionar credenciais ao seu aplicativo.
• Adicione seu aplicativo ao fluxo de usuários
• Uma versão mínima do .NET 8.0 SDK .

Python Django

• Registre um novo aplicativo no centro de administração do Microsoft Entra, configurado para Contas somente neste diretório organizacional. Consulte Registar uma candidatura para obter mais detalhes. Registre os seguintes valores na página Visão geral do aplicativo para uso posterior:
  • ID da aplicação (cliente)
  • ID do diretório (inquilino)
• Adicione os seguintes URIs de redirecionamento usando a configuração da plataforma Web . Consulte Como adicionar um URI de redirecionamento em seu aplicativo para obter mais detalhes.
  • Redirecionar URI: http://localhost:5000/getAToken
• Adicione seu aplicativo ao fluxo de usuários
• Python 3 +
• Adicione um segredo de cliente ao registro do seu aplicativo. Não use segredos de cliente em aplicativos de produção. Em vez disso, use certificados ou credenciais federadas. Para obter mais informações, consulte Adicionar credenciais ao seu aplicativo.

Python Flask

• Registre um novo aplicativo no centro de administração do Microsoft Entra, configurado para Contas somente neste diretório organizacional. Consulte Registar uma candidatura para obter mais detalhes. Registre os seguintes valores na página Visão geral do aplicativo para uso posterior:
  • ID da aplicação (cliente)
  • ID do diretório (inquilino)
• Adicione os seguintes URIs de redirecionamento usando a configuração da plataforma Web . Consulte Como adicionar um URI de redirecionamento em seu aplicativo para obter mais detalhes.
  • Redirecionar URI: http://localhost:5000/getAToken
• Adicione seu aplicativo ao fluxo de usuários
• Python 3 +
• Adicione um segredo de cliente ao registro do seu aplicativo. Não use segredos de cliente em aplicativos de produção. Em vez disso, use certificados ou credenciais federadas. Para obter mais informações, consulte Adicionar credenciais ao seu aplicativo.

Clone ou baixe um aplicativo Web de exemplo

Nó

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 digite o seguinte comando:

  git clone https://github.com/Azure-Samples/ms-identity-ciam-javascript-tutorial.git
  

• Como alternativa, baixe o .zip arquivo de exemploe depois extraia-o para um caminho de ficheiro onde o nome tem menos de 260 caracteres.

Instalar dependências do projeto

1. Abra uma janela do console e mude para o diretório que contém o aplicativo de exemplo Node.js:

   cd 1-Authentication\5-sign-in-express\App
   

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

   npm install
   

ASP.NET Núcleo

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 digite o seguinte comando:

  git clone https://github.com/Azure-Samples/ms-identity-ciam-dotnet-tutorial.git
  

• Baixe o arquivo .zip. Extraia-o para um caminho de arquivo onde o comprimento do nome é inferior a 260 caracteres.

Python Django

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 digite o seguinte comando:

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

• Baixe o arquivo .zip. Extraia-o para um caminho de arquivo onde o comprimento do nome é inferior a 260 caracteres.

Instalar dependências do projeto

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

   cd django-web-app
   

2. Configure o ambiente virtual:

   • Para Windows, execute os seguintes comandos:

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

   • Para macOS/Linux, execute os seguintes comandos:

   python3 -m venv .venv
   source .venv/bin/activate
   

3. Para instalar dependências de aplicativos, execute os seguintes comandos:

   python3 -m pip install -r requirements.txt
   

Python Flask

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 digite o seguinte comando:

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

• Baixe o arquivo .zip. Extraia-o para um caminho de arquivo onde o comprimento do nome é inferior a 260 caracteres.

Instalar dependências do projeto

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

   cd flask-web-app
   

2. Configure o ambiente virtual:

   • Para Windows, execute os seguintes comandos:

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

   • Para macOS/Linux, execute os seguintes comandos:

   python3 -m venv .venv
   source .venv/bin/activate
   

3. Para instalar dependências de aplicativos, execute os seguintes comandos:

   python3 -m pip install -r requirements.txt
   

Configurar o aplicativo Web de exemplo

Para que possa iniciar sessão os utilizadores com a aplicação de exemplo, tem de atualizá-la com a sua aplicação e os detalhes do locatário.

Nó

1. No editor de códigos, abra arquivo App\authConfig.js.

2. Encontre o espaço reservado:

   • Enter_the_Application_Id_Here e substitua-o pelo ID da aplicação (cliente) da aplicação que registou anteriormente.
   • Enter_the_Tenant_Subdomain_Here e substitua-o pelo subdomínio Diretório (locatário). Por exemplo, se o domínio principal do inquilino for contoso.onmicrosoft.com, use contoso. Se não tiver o nome do inquilino, saiba como ler os detalhes do inquilino.
   • Enter_the_Client_Secret_Here e substitua-o pelo valor secreto do aplicativo copiado anteriormente.

ASP.NET Núcleo

1. Navegue até o diretório raiz que contém o aplicativo de exemplo ASP.NET Core:

   cd 1-Authentication\1-sign-in-aspnet-core-mvc
   

2. Abra o arquivo appsettings.json.

3. No Authority, localize Enter_the_Tenant_Subdomain_Here e substitua-o pelo subdomínio do seu inquilino. Por exemplo, se o domínio principal do locatário for caseyjensen@onmicrosoft.com, o valor que deves inserir é casyjensen.

4. Encontre o valor Enter_the_Application_Id_Here e substitua-o pela ID do aplicativo (clientId) do aplicativo que você registrou no centro de administração do Microsoft Entra.

5. Substitua Enter_the_Client_Secret_Here pelo valor secreto do cliente que você configurou.

Python Django

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

2. Crie um ficheiro .env na pasta raiz do projeto utilizando o ficheiro .env.sample.external-id como guia.

3. No ficheiro .env, forneça as seguintes variáveis de ambiente:

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

Python Flask

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

2. Crie um ficheiro .env na pasta raiz do projeto utilizando o ficheiro .env.sample.external-id como guia.

3. No ficheiro .env, forneça as seguintes variáveis de ambiente:

   • CLIENT_ID que é o ID da aplicação (cliente) da aplicação que registou anteriormente.
   • CLIENT_SECRET qual é o valor secreto do aplicativo que você copiou anteriormente.
   • AUTHORITY é a URL que identifica uma autoridade do token. Deve ser do formato https://{subdomínio}.ciamlogin.com/{subdomínio}.onmicrosoft.com. Substitua o subdomínio pelo subdomínio do Directory (locatário). Por exemplo, se o domínio principal do inquilino for contoso.onmicrosoft.com, use contoso. Se não tiver o subdomínio do locatário, saiba como consultar os detalhes do locatário.

4. Confirme se o URI de redirecionamento está bem configurado. O URI de redirecionamento registrado anteriormente deve corresponder à sua configuração. Este exemplo por padrão define o caminho de URI de redirecionamento como /getAToken. Essa configuração está no arquivo app_config.py como REDIRECT_PATH.

Executar e testar aplicativo Web de exemplo

Nó

Agora pode testar a aplicação web de exemplo Node.js. Você precisa iniciar o servidor Node.js e acessá-lo através do seu navegador em http://localhost:3000.

1. No seu terminal, execute o seguinte comando:

   npm start 
   

2. Abra o navegador e vá para http://localhost:3000. Deverá ver uma página semelhante à captura de ecrã seguinte:

   

3. Depois que o carregamento da página for concluído, selecione Entrar quando solicitado.

4. Na página de início de sessão, escreva o seu endereço de e-mail , selecione Seguinte, escreva a sua palavra-passe e, em seguida, selecione Iniciar sessão. Se você não tiver uma conta, selecione Sem conta? Crie um link, que inicia o fluxo de inscrição.

5. Se você escolher a opção de inscrição, depois de preencher seu e-mail, senha única, nova senha e mais detalhes da conta, você conclui todo o fluxo de inscrição. Você verá uma página semelhante à captura de tela a seguir. Você verá uma página semelhante se escolher a opção de login.

   

6. Selecione Sair para encerrar a sessão do utilizador na aplicação web ou selecione Ver informações do token de ID para ver as informações do token de ID devolvidas pelo Microsoft Entra.

Como 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 ID Externa do Microsoft Entra. Na página de início de sessão ou de registo exibida, quando um utilizador entra com êxito ou cria uma conta, a ID Externa do Microsoft Entra retorna um token de ID para a aplicação. O aplicativo valida o token de ID, lê as declarações e retorna uma página segura para os usuários.

Quando os usuários selecionam o link Sair, o aplicativo limpa sua sessão e, em seguida, redireciona o usuário para o ponto de extremidade de saída do Microsoft Entra External ID para notificá-lo de que o usuário saiu.

Se você quiser criar um aplicativo semelhante ao exemplo que você executou, conclua as etapas em Iniciar usuários em seu próprio aplicativo Web Node.js artigo.

ASP.NET Núcleo

1. No shell ou na linha de comando, execute os seguintes comandos:

   dotnet run
   

2. Abra o navegador da Web e navegue até https://localhost:7274.

3. Faça login com uma conta registada no locatário externo.

4. Assim que estiver autenticado, o nome para exibição é mostrado ao lado do botão Sair, como mostrado na captura de ecrã seguinte.

   

5. Para sair do aplicativo, selecione o botão Sair.

Python Django

Execute a app para ver a experiência de início de sessão em ação.

1. No seu terminal, execute o seguinte comando:

   python manage.py runserver localhost:5000                                             
   

   Você pode usar um número de porta de sua escolha.

2. Abra o navegador e vá para http://localhost:5000. Você verá uma página semelhante à seguinte captura de tela:

   

3. Depois de o carregamento da página ser concluído, selecione o link Entrar. Pedir-lhe-ão para iniciar sessão.

4. Na página de início de sessão, escreva o seu endereço de e-mail , selecione Seguinte, escreva a sua palavra-passe e, em seguida, selecione Iniciar sessão. Se você não tiver uma conta, selecione Sem conta? Crie um link, que inicia o fluxo de inscrição.

5. Se você escolher a opção de inscrição, passará pelo fluxo de inscrição. Preencha seu e-mail, senha única, nova senha e mais detalhes da conta para concluir todo o fluxo de inscrição.

6. Depois de iniciar sessão ou inscrever-se, é redirecionado de volta para a aplicação Web. Você verá uma página semelhante à seguinte captura de tela:

   

7. Selecione logout para sair da aplicação web ou selecione Chamar uma API downstream para fazer uma chamada para um endpoint do Microsoft Graph.

Como 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 ID Externa do Microsoft Entra. Em seguida, um utilizador inicia sessão ou inscreve-se na página apresentada. Depois de fornecer as credenciais necessárias e consentir com os escopos necessários, o Microsoft Entra External ID redireciona o usuário de volta para o 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 utilizadores selecionam o link Logout, a aplicação limpa a sua sessão e redireciona o utilizador para o ponto de terminação de saída do Microsoft Entra External ID, para notificá-lo de que o utilizador saiu. O utilizador é então redirecionado de volta para a aplicação web.

Python Flask

Execute a app para ver a experiência de início de sessão em ação.

1. No seu terminal, execute o seguinte comando:

   python3 -m flask run --debug --host=localhost --port=3000
   

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

2. Abra o navegador e vá para http://localhost:3000. Deverá ver uma página semelhante à captura de ecrã seguinte:

   

3. Depois de o carregamento da página ser concluído, selecione o link Entrar. Pedir-lhe-ão para iniciar sessão.

4. Na página de início de sessão, escreva o seu endereço de e-mail , selecione Seguinte, escreva a sua palavra-passe e, em seguida, selecione Iniciar sessão. Se você não tiver uma conta, selecione Sem conta? Crie um link, que inicia o fluxo de inscrição.

5. Se escolher a opção de inscrição, passará pelo fluxo de inscrição. Preencha seu e-mail, senha única, nova senha e mais detalhes da conta para concluir todo o fluxo de inscrição.

6. Depois de iniciar sessão ou inscrever-se, é redirecionado de volta para a aplicação Web. Você verá uma página semelhante à seguinte captura de tela:

   

7. Selecione logout para sair da aplicação web ou selecione Chamar uma API downstream para fazer uma chamada para um endpoint do Microsoft Graph.

Como 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 ID Externa do Microsoft Entra. Em seguida, um utilizador inicia sessão ou inscreve-se na página apresentada. Depois de fornecer as credenciais necessárias e consentir com os escopos necessários, o Microsoft Entra External ID redireciona o usuário de volta para o 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 utilizadores selecionam o link Logout, a aplicação limpa a sua sessão e redireciona o utilizador para o ponto de terminação de saída do Microsoft Entra External ID, para notificá-lo de que o utilizador saiu. O utilizador é então redirecionado de volta para a aplicação web.

Conteúdo relacionado

Nó

• Iniciar sessão de utilizadores na sua aplicação web Node.js
• Guia de início rápido do - Inicie sessão como utilizador e acesse uma API web numa aplicação web de exemplo Node.js
• Início rápido - Editar perfil numa aplicação Web exemplo Node.js

ASP.NET Núcleo

• Utilize a nossa série de tutoriais com várias partes para criar esta aplicação Web ASP.NET a partir do zero
• Ativar redefinição de senha
• Personalizar a marca padrão

Python Django

• Inicie sessão com utilizadores utilizando um exemplo de aplicação Web Flask
• Ativar redefinição de senha
• Personalizar a marca padrão

Python Flask

• Ativar redefinição de senha
• Personalizar a marca padrão