Compartilhar via

Testar um aplicativo Web do lado do cliente JavaScript que chama o Microsoft Graph

  • Artigo

Neste tutorial, você aprenderá a usar o Proxy de Desenvolvimento para testar um aplicativo Web do lado do cliente JavaScript de exemplo que chama o Microsoft Graph.

Pré-requisitos

Esta parte do tutorial pressupõe que você instalou e configurou o Proxy de Desenvolvimento em seu computador. Caso contrário, faça isso agora.

Para seguir este tutorial, você precisa do seguinte:

Dica

Recomendamos que você use um Locatário do Desenvolvedor do Microsoft 365 com pacotes de conteúdo instalados. Obtenha seu locatário gratuito inscrevendo-se no Programa para Desenvolvedores do Microsoft 365.

Clonar e configurar o aplicativo de exemplo

Iniciar Proxy de Desenvolvimento

O Proxy de Desenvolvimento vem com uma configuração predefinida para testar aplicativos que enviam solicitações para APIs do Microsoft Graph e do SharePoint Online.

  • Abra um prompt de comando, insira devproxy --config-file "~appFolder/presets/m365.json" e pressione Enter para iniciar o Proxy de Desenvolvimento com a configuração do Microsoft 365.

Iniciar o aplicativo de exemplo

  • Abra um prompt de comando e altere para o samples diretório.
  • Insira npx lite-server e pressione Enter para iniciar o servidor Web do aplicativo de exemplo.

Captura de tela do aplicativo de exemplo em execução no navegador Microsoft Edge no macOS. O aplicativo mostra um logotipo grande da Microsoft com dois botões abaixo dele. Um botão primário com o texto

Testar o aplicativo de exemplo

  1. No aplicativo em execução, selecione o Without SDK botão .

Cuidado

Se você tiver uma página vazia depois de clicar no Without SDK botão, marcar que configurou o registro do aplicativo Azure AD. O problema ocorre quando o .env arquivo que contém o Client ID do registro do aplicativo está ausente.

  1. Selecione o Login botão e conclua o fluxo de entrada.

Captura de tela do aplicativo de exemplo em execução no navegador Microsoft Edge no Windows 11. O aplicativo mostra um logotipo grande da Microsoft com dois botões abaixo dele. Um botão primário com o texto 'Logon' e um botão secundário com o texto 'Voltar'.

O Proxy de Desenvolvimento introduz falhas em seu aplicativo interceptando solicitações para o Microsoft Graph. Ele usa 50% de chance para solicitações com falha com um erro HTTP aleatório com suporte status código.

Exiba a saída do proxy e reserve um momento para atualizar o aplicativo de exemplo. Veja como o aplicativo de exemplo manipula (ou não, neste caso) as falhas introduzidas pelo proxy.

Captura de tela do aplicativo de exemplo em execução no Microsoft Edge. Os avatares do usuário não são mostrados no aplicativo. As Ferramentas de Desenvolvedor do Microsoft Edge estão abertas ao lado com erros mostrados no log do console.

  1. Pressione Ctrl + C para interromper o Proxy de Desenvolvimento.

Próxima etapa

Explorar guias de instruções