Présentation du format des messages actionnables dans Outlook

  • 3 minutes

Les Messages actionnables dans Outlook utilisent le code JSON de Carte adaptative pour ajouter la section de carte de message actionnable à un message électronique. Dans cette unité, nous allons examiner comment le code JSON de Carte adaptative est ajouté au message électronique.

Carte de message actionnable

La carte de message constitue un composant clé des Messages actionnables. La carte apparaît en évidence en haut d’un message, à l’aide d’éléments d’interface utilisateur qui s’intègrent à l’interface utilisateur native du client de courrier. Le positionnement en évidence de la carte est idéal pour communiquer des informations clés et solliciter l’action du destinataire.

La carte est implémentée à l’aide de la syntaxe et des fonctionnalités standard de Carte adaptative. De nouvelles fonctionnalités propres à Outlook y sont aussi ajoutées.

Examinons un exemple simple. Le code JSON suivant implémente une carte de base.

{
  "type": "AdaptiveCard",
  "version": "1.0",
  "originator": "5a53e3ea-f50a-44d2-8855-2b5825d63eb8",
  "hideOriginalBody": "true",
  "body": [
    {
      "type": "TextBlock",
      "text": "Visit the Outlook Dev Portal",
      "size": "large"
    },
    {
      "type": "TextBlock",
      "text": "Click **Learn More** to learn more about Actionable Messages!"
    },
    {
      "type": "Input.Text",
      "id": "feedbackText",
      "placeholder": "Let us know what you think about Actionable Messages"
    }
  ],
  "actions": [
    {
      "type": "Action.Http",
      "title": "Send Feedback",
      "method": "POST",
      "url": "https://...",
      "body": "{{feedbackText.value}}"
    },
    {
      "type": "Action.OpenUrl",
      "title": "Learn More",
      "url": "https://learn.microsoft.com/outlook/actionable-messages"
    }
  ]
}

Cette carte utilise des éléments standard de Carte adaptative, tels que TextBlock, Input.Text et Action.OpenUrl. Elle utilise également des fonctionnalités propres à Outlook, notamment les suivantes :

  • La propriété originator inclut l’ID de fournisseur affecté lors de l’inscription de votre service. L’inscription est couverte dans un module ultérieur.
  • La propriété hideOriginalBody contrôle si le client Outlook affiche le corps HTML du message électronique sous la carte. Vous avez ainsi la possibilité d’utiliser la carte pour remplacer entièrement le corps ou pour le compléter. Pour les clients de courrier qui ne prennent pas en charge les Messages actionnables, le corps HTML est toujours affiché. Pour cette raison, vous pouvez choisir d’utiliser le corps HTML comme message de secours pour les clients qui ne prennent pas en charge les Messages actionnables.
  • L’action Action.Http envoie l’entrée du destinataire au point de terminaison HTTPS spécifié dans la propriété url. Ce point de terminaison est une API web que vous avez implémentée pour recevoir les informations du Message actionnable et les traiter.

Le code JSON ci-dessus permet d’obtenir une carte semblable à la suivante dans Outlook sur le web.

Exemple de carte de message actionnable rendue dans Outlook sur le web

Ajout d’une carte à un message électronique

Les Messages actionnables sont ajoutés aux messages électroniques via l’ajout d’une balise <script> dans la balise <head> du corps HTML.

<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <script type="application/adaptivecard+json">{
    "type": "AdaptiveCard",
    "version": "1.0",
    ...
  }
  </script>
</head>
<body>
Visit the <a href="https://learn.microsoft.com/outlook/actionable-messages">Outlook Dev Portal</a> to learn more about Actionable Messages.
</body>
</html>