Configuration requise

Veillez à respecter les conditions préalables suivantes lors de la création de votre onglet de groupe ou de canal et Teams personnel :

• Activez la découverte de vos pages d’onglet dans un iFrame en utilisant les en-têtes de réponse HTTP X-Frame-Options et Content-Security-Policy .

• Vérifiez que toutes les pages d’application Teams sont hébergées sur des points de terminaison HTTPS.

• Définissez les en-têtes de stratégie de sécurité du contenu pour autoriser Teams et toutes les autres applications hôtes de votre application :

  Hôte d’application Microsoft 365	autorisation frame-ancestor
  Tous les hôtes (nouveau)	*.cloud.microsoft
  Teams	teams.microsoft.com, *.teams.microsoft.com
  Application Microsoft 365	*.microsoft365.com, *.office.com,
  Outlook	outlook.office.com, outlook.office365.com, outlook-sdf.office.com, outlook-sdf.office365.com

  Avertissement

  Les services cloud de Microsoft, y compris les versions web des domaines Teams, Outlook et Microsoft 365, migrent vers le *.cloud.microsoft domaine. Effectuez les étapes suivantes avant septembre 2024 pour vous assurer que votre application continue à s’afficher sur les hôtes clients web Microsoft 365 pris en charge :

  1. Mettez à jour la bibliothèque TeamsJS vers la version 2.19.0 ou ultérieure. Pour plus d’informations sur la dernière version de TeamsJS, consultez Bibliothèque de client JavaScript Microsoft Teams.

  2. Si vous avez défini des en-têtes de stratégie de sécurité de contenu (CSP) pour votre application, mettez à jour la directive frame-ancestors pour inclure le *.cloud.microsoft domaine. Pour garantir la compatibilité descendante pendant la migration, conservez les valeurs existantes frame-ancestors dans vos en-têtes CSP. Cette approche garantit que votre application continue de fonctionner sur les applications hôtes Microsoft 365 existantes et futures et réduit le besoin de modifications ultérieures.

  Mettez à jour le domaine suivant dans la frame-ancestors directive des en-têtes CSP de votre application :

  https://*.cloud.microsoft
  

  Remarque

  Pour héberger les autres applications Teams ou Microsoft 365 au sein de votre application, mettez à niveau votre application vers un environnement Microsoft 365. Si vous gérez l’application en cours d’exécution dans le cadre imbriqué, vous pouvez mettre à jour son code pour initialiser le Kit de développement logiciel (SDK) en spécifiant votre domaine. Cela permet à votre frame imbriqué d’agir en tant que proxy pour Teams.

• Pour la compatibilité d’Internet Explorer 11, définissez X-Content-Security-Policy. Vous pouvez également définir l’en-tête X-Frame-Options: ALLOW-FROM https://teams.microsoft.com/. Cet en-tête est déconseillé, mais la plupart des navigateurs l’acceptent toujours.

• Les pages de connexion ne s’affichent pas dans les iFrames comme protection contre le détournement de clics. Votre logique d’authentification doit utiliser une méthode autre que la redirection. Par exemple, utilisez l’authentification basée sur les jetons ou sur les cookies.

  Remarque

  Il est recommandé de définir l’utilisation prévue pour vos cookies plutôt que de vous appuyer sur le comportement du navigateur par défaut. Pour plus d’informations, consultez Attribut de cookie SameSite.

• La même restriction de stratégie d’origine des navigateurs empêche les pages web d’effectuer des requêtes vers des domaines autres que ceux de la page web servie. Vous pouvez donc rediriger la page de configuration ou de contenu vers un autre domaine ou sous-domaine. Votre logique de navigation inter-domaines doit permettre au client Teams de valider l’origine par rapport à une liste statique validDomains dans le manifeste de l’application lors du chargement ou de la communication avec l’onglet.

• Stylisez vos onglets en fonction du thème, de la conception et de l’intention du client Teams. Les onglets fonctionnent mieux lorsqu’ils sont conçus pour répondre à un besoin spécifique et se concentrent sur un petit ensemble de tâches ou un sous-ensemble de données pertinents pour l’emplacement du canal de l’onglet.

• Dans votre page de contenu, ajoutez une référence à la bibliothèque de client JavaScript Microsoft Teams à l’aide de balises de script. Une fois votre page chargée, appelez app.initialize(), sinon votre page n’est pas affichée.

• Pour que l’authentification fonctionne sur les clients mobiles, vous devez effectuer une mise à niveau vers TeamsJS version 1.4.1 ou ultérieure.

• Si vous choisissez d’afficher l’onglet de votre canal ou de votre groupe sur un client mobile Teams, la configuration setConfig() doit avoir une valeur pour la propriété websiteUrl.

• L’onglet Microsoft Teams ne prend pas en charge la possibilité de charger des sites web intranet qui utilisent des certificats auto-signés.

Outils pour créer des onglets

Créer votre onglet Teams

Nous allons maintenant créer votre onglet. Toutefois, sélectionnez d’abord votre choix d’onglet à créer :

Voir aussi

• Créer des onglets pour Teams
• Créer votre première application d’onglet à l’aide de JavaScript
• Inscrire votre application d’onglet dans l’ID Microsoft Entra
• Onglets sur les appareils mobiles
• Accorder l’autorisation d’appareil à l’onglet dans Teams
• Stratégie de sécurité du contenu