Adaptive cards for MS Teams - images displaying in web interface but not desktop application

2
votes

I have a recurring issue with teams and adaptive cards. It doesn't seem to matter if I post a card from the Flow post an adaptive card connector or from the graph API directly, the images in my cards display in the teams web browser interface but not in the desktop application.

Apart from that the card displays ok, just no image rendering in desktop. Tough one to debug as it's working ok in chrome, if there a way to look at the desktop apps source code to see if that img url is being prefixed or replaced or something down those lines.

Curious thing is I've seen a couple of videos of it working for others but. Here's my card code within the Graph API body JSON...

{
"subject": null,
"body": {
    "contentType": "html",
    "content": "<attachment id=\"74d20c7f34aa4a7fb74e2b30004247c5\"></attachment>"
},
"attachments": [
    {
        "id": "74d20c7f34aa4a7fb74e2b30004247c5",
        "contentType": "application/vnd.microsoft.card.adaptive",
        "contentUrl": null,
        "content": "{ \"type\": \"AdaptiveCard\", \"body\": [ { 
        \"type\": \"TextBlock\",
        \"size\": \"Medium\",
        \"weight\": \"Bolder\",
        \"text\": \"Hello andy\"
    },
    {
        \"type\": \"Image\",
        \"altText\": \"\",
        \"url\": \"https://companyname.sharepoint.com/sites/TeamsDev/ImageLib/imagebname.jpg\"
    }
],
\"$schema\": \"http://adaptivecards.io/schemas/adaptive-card.json\",
\"version\": \"1.0\"
}",
        "name": null,
        "thumbnailUrl": null
    }
]
}
2
microsoft-teamsadaptive-cardsmicrosoft-graph-teams
I'm not 100% sure on this, but just a guess - perhaps because the image is stored on SharePoint, which is secured. In the browser, the user has a signed-in session to SharePoint, but perhaps that's not respected in the Teams client. Just a thought... – Hilton Giesenow
Thanks again for your help Hilton, if you help me any more this week i've have to pay you a consultants fee :), looks like you are absolutely right and I should have thought of that, I was thinking Teams would like the fact it's an HTTPS url, didnt consider that the app wouldnt have the authentication of course! – andy moore
Glad to hear it's working. Will log as a proper answer then in fact, so others can find it in future. Lol about consulting fees - just tell me where to send the invoice ;-) – Hilton Giesenow

2 Answers

1
votes

As per comments, this was because of the image Url - it's a SharePoint Url , so silently uses the users login session in the web client, but doesn't do the same in the desktop client.

1
votes

Yes, When you try to load an image within Adaptive Card using sharepoint url, It uses the accessToken in the images url (which you can see if you try to debug) when you load the adaptive card in Teams Web version with the same user credentails it will work because session But this same behavior will not work with Teams Desktop client. Better to put the images in solution itself and use from there.