Search code examples
botframeworkadaptive-cards

adaptive card js rendering - card not supported


I am trying to use the javascript rendering SDK to render my layout. My bot is returning a hero card with the following JSON in message.attachments. the json is as below:

[
    {
        "contentType":"application/vnd.microsoft.card.hero",
        "content":
            {
                "text":"Please select an option",
                "buttons":
                    [
                        {
                            "type":"a1",
                            "title":"1.Choice1",
                            "value":"1.Choice1"
                        }, 
                        {
                            "type":"a1",
                            "title":"2.Choice2",
                            "value":"2.Choice2"
                        }
                    ]
            }
    }
]

This renders fine in webchat, emulator...but in my custom rendering, the output of rendering is

"The specified card version is not supported."

i am loading the sdk from https://unpkg.com/adaptivecards/dist/adaptivecards.js

I would think if webchat supports it, then javascript SDK should render it too.


Solution

  • The json object your bot responsed, is a hero card not an Adaptive Card. So the javascript sdk throw this execption.

    An adaptive card must follow its shema, please refer to Adaptive Card Renderer Specification for detailed rules.

    Following is a validated sample:

    {
        "type": "AdaptiveCard",
        "version": "1.0",
        "body": [
            {
                "type": "TextBlock",
                "text": "Here is a ninja cat"
            },
            {
                "type": "Image",
                "url": "http://adaptivecards.io/content/cats/1.png"
            }
        ]
    }