Adaptive cards - serving images in bytes

Question

I'm trying to put an image in Adaptive Card in Bot framework like this way:

card.Body.Add(new AdaptiveImage()
{
    Type = "Image",
    Url = new Uri(pictureUrl),
    Size = AdaptiveImageSize.Large
});

It's working. The problem is with Url. I get images from the external web service in Base64 format. But sometimes I get too large image so I get The uri string is too long exception.

Is there any way how to handle that problem? For example, enable putting the image in Adaptive card in bytes.

Answer 1

thanks for reporting this issue. The root cause is that the pictureUrl is longer than .NET's max Uri length. We're tracking fixing this here.

There's a pretty simple workaround available, since the limitation is occurring in the .NET C# library which you're using to simply author the card, but WebChat doesn't use the C# library to display cards (it uses the JS library, and JS/HTML doesn't have a length limit!). Therefore, the only thing that isn't working in your case is generating the JSON... but there's a simple fix!

Workaround: Define the following class, extending AdaptiveImage, adding a LongUrl property (which writes to the same url property in the JSON).

public class AdaptiveImageWithLongUrl : AdaptiveImage
{
    [JsonProperty(PropertyName = "url", Required = Required.Always)]
    public string LongUrl { get; set; }
}

Then, use your new image class and the new property when assigning long urls!

// A data URL that's longer than .NET max length
string actualUrl = "data:image/gif;base64," + string.Join("", new int[120000].Select(i => "A")) + "end";

AdaptiveCard card = new AdaptiveCard("1.0")
{
    Body =
    {
        new AdaptiveImageWithLongUrl()
        {
            LongUrl = actualUrl
        }
    }
};

// Place the JObject in the attachment!
var attachment = new Attachment()
{
    Content = card,
    ContentType = "application/vnd.microsoft.card.adaptive",
    Name = "cardName"
};