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. Pour que les participants à la réunion interagissent avec une application web ou un document tiers, l’extension de réunion de l’application ou du document doit être installée dans leur client Teams. S’ils n’ont pas d’extension de réunion, Teams invite les participants à installer l’extension de réunion.

Lorsque vous sélectionnez le bouton Partager dans la réunion , il lance un lien profond vers 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}

Pour plus d’informations, consultez Générer un lien profond pour partager du contenu dans des réunions.

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 souhaitée 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	soi-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 afin de partager du contenu sur scène, vous devez disposer d’un contexte d’application. Le contexte de l’application permet au client Teams d’extraire le manifeste de l’application et de case activée si le partage sur scène est possible. Voici un exemple de contexte d’application :

{ "appSharingUrl" : "https://teams.microsoft.com/extensibility-apps/meetingapis/view", "appId": "9ec80a73-1d41-4bcb-8190-4b9eA9e29fbb" , "useMeetNow": false }

Les paramètres de requête pour le contexte de l’application sont les suivants :

• appID: il s’agit de l’ID qui peut être obtenu à partir du manifeste de l’application.
• appSharingUrl: l’URL, qui doit être partagée sur scène, doit être un domaine valide défini dans le manifeste de l’application. Si l’URL n’est pas un domaine valide, une boîte de dialogue d’erreur s’affiche pour fournir à l’utilisateur une description de l’erreur.
• useMeetNow: cela inclut un paramètre booléen qui peut être true ou false.

  • True : lorsque la useMeetNow valeur est true et s’il n’y a pas de réunion en cours, une nouvelle réunion Meet now est lancée. En cas de réunion en cours, cette valeur est ignorée.

  • False : la valeur par défaut de useMeetNow est false, ce qui signifie que lorsqu’un lien profond est partagé vers la phase et qu’il n’y a pas de réunion en cours, une fenêtre contextuelle de calendrier s’affiche. Toutefois, vous pouvez partager directement au cours d’une réunion.

Vérifiez que tous les paramètres de requête sont correctement encodés dans l’URI et que le contexte de l’application doit être codé deux fois dans l’URL finale. Voici un exemple :

const appContext= JSON.stringify({ 
  "appSharingUrl" : "https://teams.microsoft.com/extensibility-apps/meetingapis/view",
  "appId": "9cc80a93-1d41-4bcb-8170-4b9ec9e29fbb",
  "useMeetNow": false
});
const encodedContext = encodeURIComponent(appContext).replace(/'/g,"%27").replace(/"/g,"%22");
const encodedAppContext = encodeURIComponent(encodedContext).replace(/'/g,"%27").replace(/"/g,"%22");

Un lien profond peut être lancé à partir du web Teams ou à partir du client de bureau ou mobile Teams.

• Web Teams : utilisez le format suivant pour lancer un lien profond à partir du web Teams afin de partager du contenu sur scène :

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

  Exemple : https://teams.microsoft.com/l/meeting-share?deeplinkId={sampleid}&fqdn=teams.microsoft.com&lm=deeplink%22&appContext=%257B%2522appSharingUrl%2522%253A%2522https%253A%252F%252Fteams.microsoft.com%252Fextensibility-apps%252Fmeetingapis%252Fview%2522%252C%2522appId%2522%253A%25229cc80a93-1d41-4bcb-8170-4b9ec9e29fbb%2522%252C%2522useMeetNow%2522%253Atrue%257D

  Lien profond	Format	Exemple
  Pour partager l’application et ouvrir le calendrier Teams, lorsque useMeeetNow a la valeur false, valeur par défaut.	https://teams.microsoft.com/l/meeting-share?deeplinkId={deeplinkid}&fqdn={fqdn}}&lm=deeplink%22&appContext={encoded app context}	https://teams.microsoft.com/l/meeting-share?deeplinkId={sampleid}&fqdn=teams.microsoft.com&lm=deeplink%22&appContext=%257B%2522appSharingUrl%2522%253A%2522https%253A%252F%252Fteams.microsoft.com%252Fextensibility-apps%252Fmeetingapis%252Fview%2522%252C%2522appId%2522%253A%25229cc80a93-1d41-4bcb-8170-4b9ec9e29fbb%2522%252C%2522useMeetNow%2522%253Afalse%257D
  Pour partager l’application et lancer une réunion instantanée, quand useMeeetNow a la valeur true.	https://teams.microsoft.com/l/meeting-share?deeplinkId={deeplinkid}&fqdn={fqdn}}&lm=deeplink%22&appContext={encoded app context}	https://teams.microsoft.com/l/meeting-share?deeplinkId={sampleid}&fqdn=teams.microsoft.com&lm=deeplink%22&appContext=%257B%2522appSharingUrl%2522%253A%2522https%253A%252F%252Fteams.microsoft.com%252Fextensibility-apps%252Fmeetingapis%252Fview%2522%252C%2522appId%2522%253A%25229cc80a93-1d41-4bcb-8170-4b9ec9e29fbb%2522%252C%2522useMeetNow%2522%253Atrue%257D

• Client de bureau ou mobile Teams : utilisez le format suivant pour lancer un lien profond à partir du client de bureau ou mobile Teams afin de partager du contenu sur scène :

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

  Exemple : msteams:/l/meeting-share?deeplinkId={sampleid}&fqdn=teams.microsoft.com&lm=deeplink%22&appContext=%257B%2522appSharingUrl%2522%253A%2522https%253A%252F%252Fteams.microsoft.com%252Fextensibility-apps%252Fmeetingapis%252Fview%2522%252C%2522appId%2522%253A%25229cc80a93-1d41-4bcb-8170-4b9ec9e29fbb%2522%252C%2522useMeetNow%2522%253Atrue%257D

  Lien profond	Format	Exemple
  Pour partager l’application et ouvrir le calendrier Teams, lorsque useMeeetNow a la valeur false, valeur par défaut.	msteams:/l/meeting-share? deeplinkId={deeplinkid}&fqdn={fqdn}&lm=deeplink%22&appContext={encoded app context}	msteams:/l/meeting-share?deeplinkId={sampleid}&fqdn=teams.microsoft.com&lm=deeplink%22&appContext=%257B%2522appSharingUrl%2522%253A%2522https%253A%252F%252Fteams.microsoft.com%252Fextensibility-apps%252Fmeetingapis%252Fview%2522%252C%2522appId%2522%253A%25229cc80a93-1d41-4bcb-8170-4b9ec9e29fbb%2522%252C%2522useMeetNow%2522%253Afalse%257D
  Pour partager l’application et lancer une réunion instantanée, quand useMeeetNow a la valeur true.	msteams:/l/meeting-share? deeplinkId={deeplinkid}&fqdn={fqdn}&lm=deeplink%22&appContext={encoded app context}	msteams:/l/meeting-share?deeplinkId={sampleid}&fqdn=teams.microsoft.com&lm=deeplink%22&appContext=%257B%2522appSharingUrl%2522%253A%2522https%253A%252F%252Fteams.microsoft.com%252Fextensibility-apps%252Fmeetingapis%252Fview%2522%252C%2522appId%2522%253A%25229cc80a93-1d41-4bcb-8170-4b9ec9e29fbb%2522%252C%2522useMeetNow%2522%253Atrue%257D

Les paramètres de requête sont les suivants :

• deepLinkId: identificateur utilisé pour la corrélation de télémétrie.
• fqdn: fqdn est un paramètre facultatif, qui peut être utilisé pour basculer vers un environnement approprié d’une réunion afin de partager une application sur scène. Il prend en charge les scénarios où un partage d’application spécifique se produit dans un environnement particulier. La valeur par défaut de est l’URL d’entreprise fqdn et les valeurs possibles sont Teams.live.com pour Teams for Life, teams.microsoft.comou teams.microsoft.us.

Pour partager l’ensemble de l’application à l’étape, dans le manifeste de l’application, vous devez configurer meetingStage et meetingSidePanel en tant que contextes de trame, consultez manifeste de l’application. Dans le cas contraire, les participants à la réunion risquent de ne pas être en mesure de voir le contenu sur scène.

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