SOLVED

Unable to send an image attachment to the incoming webhook in Teams

Copper Contributor

We have a teams bot app, as well as an integration with incoming webhook. 

The usecase here is, to send an image to a teams channel using incoming webhook. 

Its working fine when we send the image though the bot chat.  with this format. 

 

{
    "type": "message",
    "attachments": [
        {
            "contentType": "application/vnd.microsoft.card.adaptive",
            "content": {
                "type": "AdaptiveCard",
                "body": [
                    {
                        "type": "ActionSet",
                        "actions": [
                            {
                                "type": "Action.OpenUrl",
                                "title": "View in Datafi",
                                "style": "default",
                                "role": "Link",
                                "url": "https://abc.us",
                                "tooltip": "View in abc"
                            }
                        ]
                    }
                ],
                "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
                "version": "1.0"
            }
        },
        {
            "contentType": "image/jpeg",
            "contentUrl": "data:application/jpeg;base64,/xxxxxxxx"
        }
    ]
}

 


When trying to send the same with the incoming webhook, its  failing with error "Webhook message delivery failed with error: Microsoft Teams endpoint returned HTTP error 400 with ContextId 01=2..".

What's the best way to send the same content using incoming webhook
Contents:
1. a base64 encoded image (its a screenshot of a dashboard)
2. link to the full version

3 Replies
best response confirmed by ameenv (Copper Contributor)
Solution

@ameenv - To send an image to a Teams channel using an incoming webhook, you can include the image as an attachment in the Adaptive Card payload. 

{
  "type": "message",
  "attachments": [
    {
      "contentType": "application/vnd.microsoft.card.adaptive",
      "content": {
        "type": "AdaptiveCard",
        "body": [
          {
            "type": "ActionSet",
            "actions": [
              {
                "type": "Action.OpenUrl",
                "title": "View in Datafi",
                "style": "default",
                "role": "Link",
                "url": "https://abc.us",
                "tooltip": "View in abc"
              }
            ]
          },
          {
            "type": "Image",
            "url": "data:image/jpeg;base64,/xxxxxxxx"
          }
        ],
        "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
        "version": "1.0"
      }
    }
  ]
}

In this example, the image is included as an attachment of type "Image" with the URL set to the base64 encoded image data. Make sure to replace /xxxxxxxx with the actual base64 encoded image data.

 

 

 

Thanks, 

Prasad Das

------------------------------------------------------------------------------------------ 

If the response is helpful, please click "**Mark as Best Response**" and like it. You can share your feedback via Microsoft Teams Developer Feedback link. Click here to escalate. 

@ameenv - Glad that it worked. Could you please share your valuable feedback via Microsoft Teams Developer Community Response Feedback link?

1 best response

Accepted Solutions
best response confirmed by ameenv (Copper Contributor)
Solution

@ameenv - To send an image to a Teams channel using an incoming webhook, you can include the image as an attachment in the Adaptive Card payload. 

{
  "type": "message",
  "attachments": [
    {
      "contentType": "application/vnd.microsoft.card.adaptive",
      "content": {
        "type": "AdaptiveCard",
        "body": [
          {
            "type": "ActionSet",
            "actions": [
              {
                "type": "Action.OpenUrl",
                "title": "View in Datafi",
                "style": "default",
                "role": "Link",
                "url": "https://abc.us",
                "tooltip": "View in abc"
              }
            ]
          },
          {
            "type": "Image",
            "url": "data:image/jpeg;base64,/xxxxxxxx"
          }
        ],
        "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
        "version": "1.0"
      }
    }
  ]
}

In this example, the image is included as an attachment of type "Image" with the URL set to the base64 encoded image data. Make sure to replace /xxxxxxxx with the actual base64 encoded image data.

 

 

 

Thanks, 

Prasad Das

------------------------------------------------------------------------------------------ 

If the response is helpful, please click "**Mark as Best Response**" and like it. You can share your feedback via Microsoft Teams Developer Feedback link. Click here to escalate. 

View solution in original post