Send Image to Teams Webhook with full size

Question

Hi,

I want to send image (saved as base64 table) via webhook to my Teams channel. When i use adaptiveCards it is small and there is no way to open it with real size. Is there a way to show that image in the same way as when i upload image by myself (small picture is shown, but when i point it there is clicable hand icon that opens full size image).

Answer 1

Hello Kamil,

Thank you for reaching out to the Microsoft Community. My name is Seun and I'm happy to help.

I understand that you want to Send Image to Teams Webhook with full size.

Please use the following steps to achieve your aim.

A) Upload images when creating an Incoming Webhook

I pulled the following steps from https://learn.microsoft.com/microsoftteams/platform/webhooks-and-connectors/how-to/add-incoming-webhook?tabs=newteams%2Cdotnet :

“1) In the New Teams client, select Teams and navigate to the channel where you want to add an Incoming Webhook.

2. Select More options ••• on the right side of the channel name.
3. Select Manage channel
4. Select Edit.
5. Search for Incoming Webhook and select Add.

the Incoming Webhook dialog appears.

6. Select Add.
7. Provide a name for the webhook and upload an image if necessary.
8. Select Create. (Here you will be able to upload the images in full size)
9. Copy and save the unique webhook URL present in the dialog. The URL maps to the channel and you can use it to send information to Teams.
10. Select Done. The webhook is now available in the Teams channel.

Here is a graphical representation of the steps: https://learn.microsoft.com/microsoftteams/platform/assets/images/create-incoming-webhook.gif "

B) Workarounds

If the Step A, did not work, Consider the following workaround that you can use to achieve the desired result.

1. Instead of sending the image directly through the webhook, you can send a URL that points to the image. When a user clicks on the image in the Teams channel, it will open the full-size image in a new tab or window.

Here's how you can implement this:

1. Host the image somewhere accessible via a URL: You can host the image on a web server, cloud storage (like Azure Blob Storage), or any other location that provides a publicly accessible URL.
2. Send the image URL through the Teams webhook: In your webhook payload, instead of sending the base64 encoded image data, send the URL of the hosted image.
3. Users can click the image to open the full-size version: When the message is posted in the Teams channel, users will see a small preview of the image. However, when they click on the image, it will open the full-size version in a new tab or window, since it's just a regular URL.

By following this approach, you can provide a way for users to view the full-size image while still using the Teams webhook functionality. Keep in mind that hosting the images externally may have implications for image availability, bandwidth usage, and potential security concerns, depending on your specific requirements.

I hope this information helps, if you require further help or information, please let me know.

Best Regards,

Seun

Answer 2

Thank you for your reply, but due to security concerns i need to send image using base64 data. When i try to do this image is small and in very low quality. Is there a way to fix this and see full image resolution?

Answer 3

Hello Kamil,

Thanks for your response.

Apologies that there is no currently a way to directly send a full-size, high-resolution image with Teams webhooks using base64 encoding and still have it display in full size within the Teams channel.

This is because the Base64 Encoding converts an image into a text format. While convenient for sending data, it can increase the file size depending on the image size. This can lead to a compressed and lower-quality image displayed in Teams.

Furthermore, Teams webhooks are designed to display previews and prioritize quick communication. They might automatically resize large base64 encoded images to fit within the message card.

While you prioritize security and want to avoid external hosting, here are some alternative approaches that might offer a balance between security and user experience:

A) Reduce Image Size with Minimal Quality Loss: Consider using image optimization tools to compress the base64 encoded image before sending it through the webhook. This can help reduce file size without significantly impacting image quality.

B) Inform Users About Full-Size Download: Within the Teams message triggered by the webhook, include a text notification informing users that the image is available for download in full resolution. You can provide a secure internal download link if possible, or offer instructions on how to access the full-size version within your system (if applicable).

C) Explore Microsoft Teams APIs: If you have more development resources, investigate the capabilities of the Microsoft Teams APIs (https://learn.microsoft.com/graph/api/resources/teams-api-overview?view=graph-rest-1.0). These APIs might offer more control over image handling and potentially allow sending full-size images securely, although this approach might require additional coding efforts.

While sending a full-size, high-resolution image with Teams webhooks using base64 encoding isn't directly achievable, these alternative solutions can provide a balance between security and user experience.

I hope this information helps, if you require further help or information, please let me know.

Best Regards,

Seun

Answer 4

Thank you, i will take a look at your suggestions

Answer 5

Hi Kamil,

You're welcome! I'm glad I could provide some helpful suggestions for you to look into.

If you require further help or information, please let me know.

Best Regards,

Seun

Give back to the Community. Help the next person who has this issue by indicating if this reply solved your problem. Click Yes or No below.