Creación de las pestañas de Microsoft Teams con SharePoint Framework

A partir de SharePoint Framework v1.8, puede crear pestañas para Microsoft Teams con las herramientas SharePoint Framework y usar SharePoint como host para sus soluciones. Como parte de la SharePoint Framework v1.10 también puedes publicar la solución como Microsoft Teams aplicación personal.

Las ventajas de usar el SharePoint Framework como plataforma para las pestañas Microsoft Teams incluyen las siguientes:

  • El modelo de desarrollo es similar SharePoint Framework elementos web
  • Cualquier elemento web puede exponerse como una pestaña o una aplicación personal en Microsoft Teams
  • Las distintas opciones de ámbito para exponer una pestaña personalizada como un elemento web y una pestaña en el espacio empresarial
  • La pestaña se ejecutará en el contexto de los sitios de SharePoint subyacentes detrás del equipo específico. Esto significa que puede aprovechar cualquier funcionalidad o API específica de SharePoint en el elemento web.

Proceso de desarrollo

Puede empezar a desarrollar Microsoft Teams pestañas con solo usar SharePoint Framework paquetes 1.8 o posterior. Los pasos de alto nivel para empezar son los siguientes:

Nota

Consulte los pasos detallados para empezar desde la pestaña Crear Microsoft Teams con SharePoint Framework- Tutorial que contiene detalles importantes adicionales que debe seguir.

  1. Crear una SharePoint Framework con un elemento web del lado cliente

  2. Agregue "TeamsTab" a la propiedad del manifiesto del elemento web para usarlo como pestaña en un supportedHosts canal:

    "supportedHosts": ["SharePointWebPart", "TeamsTab"],
    
  3. Agregue "TeamsPersonalApp" a la propiedad del manifiesto del elemento web para usarlo como una aplicación supportedHosts personal:

    "supportedHosts": ["SharePointWebPart", "TeamsPersonalApp"],
    
  4. Implementar el elemento web mediante la opción de implementación con ámbito de inquilino en el catálogo de aplicaciones SharePoint de aplicaciones

  5. Active la SharePoint Framework, que implementó, y seleccione Sincronizar para Teams en el Catálogo de aplicaciones

Opciones de implementación

Hay varias opciones para implementar la Microsoft Teams o como una aplicación personal. Como SharePoint y Microsoft Teams tienen su propio catálogo de aplicaciones, la implementación requiere operaciones en ambos servicios. La visibilidad de la nueva funcionalidad puede controlarse mediante los pasos de implementación que se han realizado.

Implementación de inquilinos

Puedes usar el botón Sincronizar con Teams en la cinta catálogo de aplicaciones que creará automáticamente el manifiesto de la aplicación de Microsoft Teams, el paquete de la aplicación e instalarlo en la Microsoft Teams almacén. Esto hará que la solución esté disponible para todos los usuarios de su inquilino y Microsoft Teams equipos.

Los desarrolladores también pueden definir el contenido del manifiesto Microsoft Teams aplicación y el paquete de la aplicación. Consulte Opciones de implementación para obtener SharePoint Framework soluciones para Microsoft Teams para las opciones de implementación.

Opciones de implementación alternativas

Hay una forma alternativa de implementar la solución, que por ejemplo le permitirá hacer que una solución esté disponible solo para un equipo específico del inquilino.

  1. Cree la solución SharePoint Framework de la forma normal:

    gulp bundle --ship
    gulp package-solution --ship
    
  2. Busque la carpeta ./teams en la carpeta del proyecto:

    Estructura de la solución

  3. Agregue el paquete Microsoft Teams aplicación como se describe en Opciones de implementación para SharePoint Framework soluciones para Microsoft Teams a la carpeta ./teams.

  4. Agregue la solución al catálogo de aplicaciones y asegúrese de seleccionar la opción Hacer que esta solución esté disponible para todos los sitios de la organización antes de seleccionar Implementar.

Carga lateral de aplicaciones externas en Teams

  1. Para desplazarse a la Microsoft Teams, seleccione Teams en el iniciador de aplicaciones:

    Archivo zip en el explorador

  2. Elija un equipo que desee usar para probar la funcionalidad y seleccione Administrar equipo en el ... menú:

    Administración del grupo

  3. Muévete a la pestaña Aplicaciones.

  4. Elige Upload una aplicación personalizada en la esquina inferior derecha.

    Nota

    Si esta opción no está disponible, la transferencia local no está habilitada en el espacio empresarial que usa. Compruebe la configuración de la interfaces de usuario del administrador de inquilinos.

  5. Upload el archivo de manifiesto de la aplicación Microsoft Teams que creaste anteriormente desde la carpeta ./teams de la solución recién creada y asegúrate de que esté correctamente visible en la lista de aplicaciones. Observe cómo la imagen personalizada está visible con la descripción de la solución:

    Upload aplicación

  6. Muévete a un canal del equipo en el que has cargado la solución. En la siguiente imagen, observe que hemos activado el canal General en Equipo

    Canal activado

  7. Seleccione + para agregar una nueva pestaña en el canal

  8. Seleccione la pestaña personalizada denominada MyFirstTeamTab en la lista:

    Agregar una pestaña

  9. Observe cómo puede personalizar la instancia de tabulación con las propiedades expuestas en el elemento web. Seleccione Guardar:

    Ficha Configurar

Detectar si el elemento web está en el contexto de Teams

El contexto de página de un elemento web contiene una referencia al SDK de JavaScript de Teams para que pueda obtener acceso fácilmente en el contexto de Teams cuando el elemento web se represente como una pestaña.

this.context.sdks.microsoftTeams

Nota

Para obtener más información sobre el contexto Microsoft Teams pestaña, vea Microsoft Teams de desarrollo.

Importante

La propiedad this.context.microsoftTeams ha quedado en desuso SharePoint Framework versión 1.10.

Debe usar para this.context.sdks.microsoftTeams todas las soluciones creadas con el SharePoint Framework v1.10 y versiones posteriores.

Vea también