Partager dans la réunion

Partager en réunion permet aux utilisateurs de partager des documents ou des applications web tierces à la phase de réunion. Les participants à la réunion peuvent collaborer et interagir avec les applications web tierces ou modifier les documents ensemble.

L’image suivante montre le bouton Partager dans la réunion sur l’application web :

Pendant la réunion, lorsqu’un utilisateur sélectionne le bouton Partager dans la réunion à partir de l’application web ou du document tiers, il lance un lien profond vers la phase de réunion et ouvre l’application en tant qu’affichage web dans la phase de réunion. Voici le format de lien profond :

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

Configuration requise

• Pour que les participants à la réunion interagissent avec des applications web ou des documents tiers, ils doivent disposer d’une extension de réunion de l’application ou du document installé dans leur client Teams. S’ils n’ont pas d’extension de réunion, Teams invite les participants à installer l’extension de réunion.
• Pour partager l’ensemble de l’application à la phase, vous devez configurer meetingStage et meetingSidePanel en tant que contextes de trame dans le manifeste de l’application. Dans le cas contraire, les participants à la réunion risquent de ne pas être en mesure d’afficher le contenu sur scène.

Activer le partage dans la réunion

Voici trois méthodes différentes permettant d’activer le partage en réunion. Vous pouvez utiliser l’une des méthodes en fonction de la quantité de contrôle que vous souhaitez sur les boutons Partager dans la réunion affichés sur votre page web :

Méthode 1

Cette méthode est le moyen le plus simple d’afficher le partage dans les boutons de réunion avec des personnalisations minimales. Vous pouvez personnaliser les styles, la taille et les langues des boutons.

Vous pouvez analyser votre page web pour rechercher tous les éléments HTML avec le nom de classe de type teams-share-in-meeting-button et générer dynamiquement les boutons Partager dans la réunion dans votre page.

1. Ajoutez le script launcher.js sur votre page web.

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

2. Ajoutez un élément HTML sur votre page web avec dans teams-share-in-meeting-button l’attribut class , l’ID d’application (à partir du manifeste) dans l’attribut data-app-id et le lien à partager dans l’attribut data-href . Vous pouvez également inclure les data-entity-name attributs et 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. Voici les attributs supplémentaires permettant de personnaliser le bouton Partager dans la réunion :

   • data-button-type: spécifie la couleur d’arrière-plan du bouton (primaryShareInMeeting ou secondaryShareInMeeting).
   • data-button-size: spécifie la taille du bouton en pixels.
   • data-target: spécifie si le lien s’ouvre dans la même fenêtre, dans un nouvel onglet ou dans une nouvelle fenêtre.
   • data-locale: spécifie la langue utilisateur souhaitée.

Méthode 2

Vous pouvez utiliser cette méthode pour contrôler le bouton à afficher dynamiquement ou le moment où le script est exécuté. Le script s’exécute uniquement lorsque window.shareToMicrosoftTeams.renderButtons() est appelé. Vous pouvez passer des éléments HTML spécifiques via l’API renderButtons({elements: [], shareInMeetingElements: [shareInMeetingButton]) . Vous pouvez personnaliser les styles, la taille et les langues des boutons.

L’API async shareToMicrosoftTeams.renderButtons(options) affiche tous les boutons de partage qui ont le nom de classe teams-share-button ou teams-share-in-meeting-button sur la page. Si un options (optional) objet est fourni avec une liste d’éléments comme indiqué dans le code suivant, ces éléments sont rendus dans les boutons Partager ou Partager dans la réunion .

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

1. Ajoutez le script launcher.js sur votre page web.

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

2. Créez un élément HTML et spécifiez les attributs requis. Une fois le script de lanceur entièrement chargé, vérifiez que la logique de rendu est exécutée.

   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éthode 3

Vous pouvez utiliser cette méthode pour avoir un contrôle total sur la façon dont le script est appelé et quand générer le bouton à l’aide de l’API window.shareToMicrosoftTeams.shareInMeetingClickHandler . Vous pouvez contrôler comment et où les boutons sont générés. Vous devez uniquement attacher l’API window.shareToMicrosoftTeams.shareInMeetingClickHandler à l’attribut onclick du bouton. Il peut être attaché à un lien, un bouton, un menu déroulant, etc. Vous disposez d’un contrôle total sur l’apparence de l’interface utilisateur.

L’API async shareInMeetingClickHandler(content: IShareInMeetingContent) crée un gestionnaire de rappel pour le bouton Partager dans la réunion, qui peut être exécuté en sélectionnant un bouton ou un menu.

1. Ajoutez le script launcher.js sur votre page web.

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

2. Créez un élément HTML et ajoutez à shareToMicrosoftTeams.shareInMeetingClickHandler son onClick attribut. Une fois le script de lanceur entièrement chargé, vérifiez que la logique onclick est créée.

   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>",
      });
   }
   

Voici les définitions launcher.js :

Propriété	Attribut HTML	Type	Requis	Par défaut	Description
url	data-href	Chaîne	Oui	N/A	URL du contenu de l’application à partager.
appId	data-app-id	String	Oui	N/A	ID de l’application à partager.
entityName	data-entity-name	String	Non	N/A	Nom de l’entité de l’application.
entityDescription	data-entity-description	String	Non	N/A	Description du contenu de l’application à partager.
local	data-locale	String	Non	en-US	Langue préférée de l’utilisateur.
target	data-target	String	Non	même	Spécifie si le lien s’ouvre dans la même fenêtre, nouvel onglet ou nouvelle fenêtre.
buttonType	data-button-type	String	Non	primaryShareInMeeting	Spécifie la couleur d’arrière-plan du bouton : primaryShareInMeeting ou secondaryShareInMeeting.
buttonSize	data-button-size	String	Non	N/A	Taille du bouton en pixels.

Expérience de l’utilisateur final sur les applications tierces

Une fois que vous avez activé Partager en réunion sur des applications tierces, vous pouvez partager les applications à la phase de réunion. Pour y accéder, procédez comme suit :

Si l’extension de réunion est installée :

1. Ouvrez l’application web dans le navigateur et sélectionnez Partager dans la réunion.

   

2. Sélectionnez Démarrer le partage.

   

3. L’application web est partagée à la phase de réunion et tous les participants peuvent interagir et modifier ensemble.

   

Si l’extension de réunion n’est pas installée :

1. Ouvrez l’application web dans le navigateur et sélectionnez Partager dans la réunion.

   

2. Pour installer l’application d’extension de réunion, sélectionnez Ajouter.

   

3. Sélectionnez Démarrer le partage.

   

4. L’application web est partagée à la phase de réunion et tous les participants peuvent interagir et modifier ensemble.

   

Générer un lien profond pour partager du contenu à l’étape des réunions

Vous pouvez également générer un lien profond pour partager l’application pour mettre en scène et démarrer ou rejoindre une réunion. Lorsqu’un lien profond est sélectionné dans une application par un utilisateur qui fait partie d’une réunion en cours, l’application est partagée sur la scène et une fenêtre contextuelle d’autorisation s’affiche. Les utilisateurs peuvent accorder l’accès aux participants pour collaborer avec une application.

Lorsqu’un utilisateur ne participe pas à une réunion, l’utilisateur est redirigé vers le calendrier Teams où il peut rejoindre une réunion ou lancer une réunion instantanée (Réunion maintenant).

Une fois que l’utilisateur lance une réunion instantanée (Réunion maintenant), il peut ajouter des participants et interagir avec l’application.

Pour ajouter un lien profond pour partager du contenu dans les réunions, consultez lien profond pour partager du contenu à l’étape des réunions.

Remarque

Pour que votre application réussisse la validation, lorsque vous créez un lien profond à partir de votre site web, application web ou carte adaptative, utilisez Partager en réunion comme chaîne ou copie.

Exemple de code

Exemple de nom	Description	.NET	Node.js	Manifeste
Vue de la phase de réunion	Cette application permet d’activer et de configurer vos applications pour les réunions Teams. Il illustre également l’utilisation de la fonctionnalité de partage dans la réunion.	View	View	View

Voir aussi

• Applications pour les réunions et les appels Teams
• Partager vers Teams à partir d’applications web
• Partager dans Teams à partir d’une application ou d’un onglet personnel
• Créer des liens plus étroits
• Cartes adaptatives