Prueba de una aplicación web del lado cliente de JavaScript que llama a Microsoft Graph

En este tutorial, aprenderá a usar el proxy de desarrollo para probar una aplicación web del lado cliente de JavaScript de ejemplo que llama a Microsoft Graph.

Requisitos previos

En esta parte del tutorial se supone que instaló y configuró el proxy de desarrollo en el equipo. Si no es así, haz eso ahora.

Para utilizar este tutorial, necesitará:

Sugerencia

Se recomienda usar un inquilino para desarrolladores de Microsoft 365 con paquetes de contenido instalados. Para obtener su inquilino gratuito , regístrese en el Programa para desarrolladores de Microsoft 365.

Clonación y configuración de la aplicación de ejemplo

Iniciar proxy de desarrollo

El proxy de desarrollo incluye una configuración preestablecida para probar aplicaciones que envían solicitudes a las API de Microsoft Graph y SharePoint Online.

  • Abra un símbolo del sistema, escriba y presione devproxy --config-file "~appFolder/presets/m365.json"Entrar para iniciar proxy de desarrollo con la configuración de Microsoft 365.

Inicio de la aplicación de ejemplo

  • Abra un símbolo del sistema y cambie al samples directorio.
  • Escriba npx lite-server y presione Entrar para iniciar el servidor web de la aplicación de ejemplo.

Captura de pantalla de la aplicación de ejemplo que se ejecuta en el explorador Microsoft Edge en macOS. La aplicación muestra un logotipo grande de Microsoft con dos botones debajo. Un botón principal con el texto

Prueba de la aplicación de ejemplo

  1. En la aplicación en ejecución, seleccione el Without SDK botón .

Precaución

Si tiene una página vacía después de hacer clic en el Without SDK botón, compruebe que ha configurado el registro de aplicaciones de Azure AD. El problema se produce cuando falta el .env archivo que contiene el Client ID registro de la aplicación.

  1. Seleccione el Login botón y complete el flujo de inicio de sesión.

Captura de pantalla de la aplicación de ejemplo que se ejecuta en el explorador Microsoft Edge en Windows 11. La aplicación muestra un logotipo grande de Microsoft con dos botones debajo. Botón principal con el texto

El proxy de desarrollo introduce errores en la aplicación mediante la interceptación de solicitudes a Microsoft Graph. Usa el 50 % de probabilidad de que se produzcan errores en las solicitudes con un código de estado de error HTTP admitido aleatoriamente.

Vea la salida del proxy y dedique un momento a actualizar la aplicación de ejemplo. Vea cómo controla la aplicación de ejemplo (o no, en este caso) los errores introducidos por el proxy.

Captura de pantalla de la aplicación de ejemplo que se ejecuta en Microsoft Edge. Los avatares de usuario no se muestran en la aplicación. Las Herramientas de desarrollo de Microsoft Edge están abiertas al lado de los errores que se muestran en el registro de la consola.

  1. Presione Ctrl + C para detener proxy de desarrollo.

Paso siguiente