Autenticación de inicio de sesión único con Team Toolkit y Visual Studio Code para pestañas

El kit de herramientas de Microsoft Teams le permite crear una autenticación de inicio de sesión único (SSO) para las aplicaciones de pestaña directamente en Visual Studio Code. El kit de herramientas le guiará a través del proceso y le proporcionará todo lo que necesita, incluido el aprovisionamiento del registro de la plataforma de identidad de Microsoft en Azure portal.

Introducción: crear un proyecto

  1. Cree un proyecto nuevo en el kit de herramientas.
  2. Seleccione Tab como el tipo de extensión que quiera crear.
  3. Seleccione la opción para admitir SSO.

Sugerencia

Después de la instalación, debería ver Team Toolkit en la barra de actividad del código de Visual Studio. Si no es así, haga clic con el botón derecho en la barra de actividad y seleccione Microsoft Teams para anclar el kit de herramientas para facilitar el acceso.

Configurar el proyecto

  1. Para habilitar el SSO dentro de Teams, la aplicación debe tener un recurso de registro de la aplicación de Azure. El kit de herramientas de Teams aprovisionará el registro de la aplicación en su nombre.
  2. Escriba la dirección URL donde se hospedará la aplicación y seleccione siguiente. El registro de la aplicación se configurará con la dirección URL proporcionada.
  3. Los detalles de configuración del registro de la aplicación se almacenarán en los .env archivos del código fuente del proyecto.

Si desea obtener más información sobre cómo se aprovisionará el registro de la aplicación de Azure, consulte nuestra documentación de pestañas de inicio de sesión único (SSO) .

Sugerencia

Tendrá que ir a los registros de la aplicación de Azure y actualizar el URI de la API y redirigir las direcciones URL siempre que cambie esta dirección URL.

Ejecutar el proyecto

  1. Seleccione NPM install desde la api-server carpeta. A continuación, NPM Start.
  2. Seleccione NPM install desde la .src carpeta. A continuación, NPM Start.
  3. Si usa un servicio de túnel como ngrok, ejecútelo y asegúrese de que la dirección URL coincida con lo que escribió en el Asistente para creación de proyectos. Si no es así, tendrá que actualizar el URI de la API y la dirección URL de redireccionamiento en el registro de la aplicación que se creó en Azure.
  4. Navegue a la barra de actividades en el lado izquierdo de la ventana de Visual Studio Code.
  5. Seleccione el icono Ejecutar para mostrar la vista Ejecutar y depurar .
  6. También puede usar el método abreviado de teclado Ctrl + Mayús + D.

Sugerencia

Es posible que no vea el cuadro de diálogo de instalación de la aplicación en el explorador si las ventanas emergentes están deshabilitadas para el explorador. Si esto ocurre, habilite las ventanas emergentes y actualice la página.