Microsoft Teams の Incoming/Outgoing webhook でカード送信

はじめに

自分用の簡単な備忘録です。

Microsoft Teamsの Incoming Webhook ではメッセージでMarkdown形式がサポートされていることがよく知られています。

このほかに、各種カードの送信にも対応していますが、方法があまり書かれていないので簡単に記載します。

Incoming webhook

Incoming webhook のURLに {"type":"message","text":"This is test message"} を送ると、設定したボットとしてメッセージが投稿されます。

このtext部分に、Markdownが使えますが、各種カードを送信したい場合には以下をBodyとして送信します。

{
  "type": "message",
  "attachments": [
    {
      "contentType": "application/vnd.microsoft.card.adaptive",
      "content": {
        "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
        "type": "AdaptiveCard",
        "version": "1.0",
        "body": [
          {.....}
         ]
      }
    }
  ]
}

ポイントは 以下の部分です。これによってAdaptive CardのJSONが認識されます。

 "attachments": [
    {
      "contentType": "application/vnd.microsoft.card.adaptive",

同様に、Heroカードの場合には

{
  "type": "message",
  "attachments": [
    {
      "contentType": "application/vnd.microsoft.card.hero",
      "content": {
        "title": "Seattle Center Monorail",
        "subtitle": "Seattle Center Monorail",
        "text": "The Seattle Center Monorail is an elevated train line between Seattle Center (near the Space Needle) and downtown Seattle. It was built for the 1962 World's Fair. Its original two trains, completed in 1961, are still in service.",
        "images": [
          {
            "url":"https://upload.wikimedia.org/wikipedia/commons/thumb/4/49/Seattle_monorail01_2008-02-25.jpg/1024px-Seattle_monorail01_2008-02-25.jpg"
          }
        ],
       "buttons": [
         {
            "type": "openUrl",
            "title": "Official website",
            "value": "https://www.seattlemonorail.com"
          },
         {
           "type": "openUrl",
           "title": "Wikipeda page",
           "value": "https://en.wikipedia.org/wiki/Seattle_Center_Monorail"
          }
        ]
      }
   }
  ]
}

どのカードも、とにかくattachmentとして送ります。複数指定できそうですが、最初の1カードだけが処理されます。

こんな感じで、Incoming WebhookならPostmanを使ってテストができます。

Outgoing webhook

そもそもあまりなじみのないOutgoing webhookについては以下のDocsをご覧ください。

support.microsoft.com

Teamsからのメッセージを受け取れるエンドポイントを用意して、Botへのメンションでメッセージを送ると、それをトリガーにしてメッセージを返せるというものです。

この返信メッセージにもカードが利用できます。

書式は先ほどと同様で、Outgoing webhookのリクエストを受け取ったら、レスポンスでattachment付きのJSONを送ります。

{
  "type": "message",
  "attachments": [
    {
      "contentType": "application/vnd.microsoft.card.adaptive",
      "content": {
        "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
        "type": "AdaptiveCard",
        "version": "1.0",
        "body": [
          {.....}
         ]
      }
    }
  ]
}

通常、Power AutomateからAdaptive Cardsを送る場合には親メッセージとしてしか送信できませんが、Outgoing webhookを構成するとリプライとしてカードを送れるので、簡易的なBotを作成する際に非常に便利です。

注意事項

Webhookで送るカードでは、Adaptive Cardsの中でも特にAction系が制限されています。

現在利用可能なアクションは OpenUrl, ShowCard, ToggleVisibility等、データの送信が発生しないモノに限られます。

また、＠メンションはFlowbotだと <at>user@example.com</at> で挿入できましたが、Webhookでは未対応です。

まとめ

カードをTeamsのWebhookで送る場合には

{
  "type": "message",
  "attachments": [
    {

ここが重要です。

それ以降、attachmentの中身をどう書けばいいかは公式の以下のドキュメントを参照してください。

docs.microsoft.com