Compartir en la reunión

Compartir en reunión permite a los usuarios compartir documentos o aplicaciones web de terceros en la fase de reunión. Los participantes de la reunión pueden colaborar e interactuar con las aplicaciones web de terceros o editar los documentos juntos.

En la imagen siguiente se muestra el botón Compartir en la reunión en la aplicación web:

Durante la reunión, cuando un usuario selecciona el botón Compartir en la reunión de la aplicación web o documento de terceros, inicia un vínculo profundo a la fase de reunión y abre la aplicación como una vista web en la fase de reunión. A continuación se muestra el formato de vínculo profundo:

msteams:/l/meeting-share?deeplinkId={GUID}&fqdn={string}&lm=deeplink&appContext={json encoded app context}

Requisitos previos

• Para que los participantes de la reunión interactúen con documentos o aplicaciones web de terceros, deben tener instalada una extensión de reunión de la aplicación o el documento en su cliente de Teams. Si no tienen extensión de reunión, Teams pide a los participantes que instalen la extensión de reunión.
• Para compartir toda la aplicación para la fase, debe configurar meetingStage y meetingSidePanel como contextos de marco en el manifiesto de la aplicación. De lo contrario, es posible que los participantes de la reunión no puedan ver el contenido en el escenario.

Habilitación del recurso compartido en la reunión

A continuación se muestran tres métodos diferentes para habilitar el uso compartido en la reunión. Puede usar uno de los métodos en función de la cantidad de control que desee en los botones Compartir en reunión que se muestran en la página web:

Método 1

Este método es la manera más sencilla de mostrar el recurso compartido en los botones de reunión con personalizaciones mínimas. Puede personalizar los estilos de botón, el tamaño y los idiomas.

Puede examinar la página web para buscar cualquier elemento HTML con el nombre de clase de tipo teams-share-in-meeting-button y generar dinámicamente los botones Compartir en la reunión en la página.

1. Agregue el script launcher.js en la página web.

   <script async defer src="https://teams.microsoft.com/share/launcher.js"></script>
   

2. Agregue un elemento HTML en la página web con en teams-share-in-meeting-button el class atributo , el identificador de aplicación (del manifiesto) en el data-app-id atributo y el vínculo que se va a compartir en el data-href atributo. También puede incluir los data-entity-name atributos y data-entity-description .

   <div
     class="teams-share-in-meeting-button"
     data-href="https://<link-to-be-shared>"
     data-app-id="<app-id>"
     data-entity-name="<app-name>"
     data-entity-description="<app-content-description>"
     >
   </div>
   

3. A continuación se muestran los atributos adicionales para personalizar el botón Compartir en la reunión:

   • data-button-type: especifica el color de fondo del botón (primaryShareInMeeting o secondaryShareInMeeting).
   • data-button-size: especifica el tamaño del botón en píxeles.
   • data-target: especifica si el vínculo se abre en la misma ventana, nueva pestaña o en una nueva ventana.
   • data-locale: especifica el idioma de usuario deseado.

Método 2

Puede usar este método para tener algún control sobre qué botón se va a representar dinámicamente o cuando se ejecuta el script. El script solo se ejecuta cuando window.shareToMicrosoftTeams.renderButtons() se llama a . Puede pasar elementos HTML específicos a través de la renderButtons({elements: [], shareInMeetingElements: [shareInMeetingButton]) API. Puede personalizar los estilos de botón, el tamaño y los idiomas.

La async shareToMicrosoftTeams.renderButtons(options) API representa todos los botones de recurso compartido que tienen el nombre de clase teams-share-button o teams-share-in-meeting-button en la página. Si se proporciona un options (optional) objeto con una lista de elementos como se muestra en el código siguiente, esos elementos se representan en los botones Compartir o Compartir en los botones de reunión .

options (optional): { elements?: HTMLElement[], shareInMeetingElements?: HTMLElement[] }

1. Agregue el script launcher.js en la página web.

   <script async defer src="https://teams.microsoft.com/share/launcher.js" onload="onLoadComplete()"></script>
   

2. Cree un elemento HTML y especifique los atributos necesarios. Una vez que el script del iniciador esté totalmente cargado, asegúrese de que se ejecuta la lógica de representación.

   async function onLoadComplete() {
      const shareInMeetingButton = document.createElement("div");
      shareInMeetingButton.setAttribute("data-app-id", "<app-id>");
      shareInMeetingButton.textContent = "Share Test App"
      shareInMeetingButton.setAttribute("data-href", "<app-content-url>");
      shareInMeetingButton.setAttribute("data-button-type", "secondaryShareInMeeting");
      shareInMeetingButton.setAttribute("data-locale", "fr-CA");
      await window.shareToMicrosoftTeams.renderButtons({elements: [], shareInMeetingElements: [shareInMeetingButton]});
   }  
   

Método 3

Puede usar este método para tener un control completo sobre cómo se llama al script y cuándo generar el botón mediante la window.shareToMicrosoftTeams.shareInMeetingClickHandler API. Puede controlar cómo y dónde se generan los botones. Solo tiene que adjuntar la window.shareToMicrosoftTeams.shareInMeetingClickHandler API al onclick atributo del botón. Se puede adjuntar a un vínculo, botón, menú desplegable, etc. Tiene un control completo de cómo aparece la interfaz de usuario.

La async shareInMeetingClickHandler(content: IShareInMeetingContent) API crea un controlador de devolución de llamada para compartir en el botón de reunión, que se puede ejecutar seleccionando un botón o menú.

1. Agregue el script launcher.js en la página web.

   <script async defer src="https://teams.microsoft.com/share/launcher.js" onload="onLoadComplete()"></script>
   

2. Cree un elemento HTML y agregue a shareToMicrosoftTeams.shareInMeetingClickHandler su onClick atributo. Una vez que el script del iniciador esté totalmente cargado, asegúrese de que se crea la lógica de onclick.

   async function onLoadComplete() {
      var customShareInMeetingButton = document.createElement("a");
      customShareInMeetingButton.onclick = window.shareToMicrosoftTeams.shareInMeetingClickHandler({
      url: "<app-content-url>",
      appId: "<app-id>",
      entityName: "<app-entity-name>",
      entityDescription: "<app-content-description>",
      });
   }
   

A continuación se muestran las definiciones de launcher.js:

Propiedad	Atributo HTML	Tipo	Obligatorio	Predeterminado	Descripción
url	data-href	Cadena	Sí	ND	Dirección URL del contenido de la aplicación que se va a compartir.
appId	data-app-id	Cadena	Sí	ND	Identificador de la aplicación que se va a compartir.
entityName	data-entity-name	Cadena	No	ND	Nombre de entidad de aplicación.
entityDescription	data-entity-description	Cadena	No	ND	Descripción del contenido de la aplicación que se va a compartir.
configuración regional	data-locale	Cadena	No	en-US	Idioma preferido por el usuario.
target	data-target	Cadena	No	propio	Especifica si el vínculo se abre en la misma ventana, nueva pestaña o nueva ventana.
buttonType	data-button-type	Cadena	No	primaryShareInMeeting	Especifica el color de fondo del botón: primaryShareInMeeting o secondaryShareInMeeting.
buttonSize	data-button-size	Cadena	No	ND	Tamaño del botón en píxeles.

Experiencia del usuario final en aplicaciones de terceros

Después de habilitar Compartir en reuniones en aplicaciones de terceros, puede compartir las aplicaciones en la fase de reunión. Para obtener acceso, siga estos pasos:

Si la extensión de reunión está instalada:

1. Abra la aplicación web en el explorador y seleccione Compartir en la reunión.

   

2. Seleccione Iniciar uso compartido.

   

3. La aplicación web se comparte en la fase de reunión y todos los participantes pueden interactuar y editar juntos.

   

Si la extensión de reunión no está instalada:

1. Abra la aplicación web en el explorador y seleccione Compartir en la reunión.

   

2. Para instalar la aplicación de extensión de reunión, seleccione Agregar.

   

3. Seleccione Iniciar uso compartido.

   

4. La aplicación web se comparte en la fase de reunión y todos los participantes pueden interactuar y editar juntos.

   

Generación de un vínculo profundo para compartir contenido para realizar una fase en las reuniones

También puede generar un vínculo profundo para compartir la aplicación para realizar la fase e iniciar o unirse a una reunión. Cuando un usuario que forma parte de una reunión en curso selecciona un vínculo profundo en una aplicación, la aplicación se comparte en la fase y aparece una ventana emergente de permisos. Los usuarios pueden conceder acceso a los participantes para colaborar con una aplicación.

Cuando un usuario no está en una reunión, el usuario se redirige al calendario de Teams, donde puede unirse a una reunión o iniciar una reunión instantánea (Reunirse ahora).

Una vez que el usuario inicia una reunión instantánea (Reunirse ahora), puede agregar participantes e interactuar con la aplicación.

Para agregar un vínculo profundo para compartir contenido en reuniones, consulte vínculo profundo para compartir contenido para realizar la fase de las reuniones.

Nota:

Para que la aplicación pase la validación, cuando cree un vínculo profundo desde el sitio web, la aplicación web o la tarjeta adaptable, use Compartir en la reunión como cadena o copia.

Ejemplo de código

Ejemplo de nombre	Descripción	.NET	Node.js	Manifiesto
Vista previa de la reunión	Esta aplicación ayuda a habilitar y configurar las aplicaciones para las reuniones de Teams. También muestra el uso del recurso compartido en la característica de reunión.	View	View	Ver

Consulte también

• Aplicaciones para reuniones y llamadas de Teams
• Compartir en Teams desde aplicaciones web
• Compartir en Teams desde una aplicación personal o una pestaña
• Crear vínculos profundos
• Tarjetas adaptables