show ms graph user photo in an adaptive card

[afahmy11]

hi

i am getting the user photo using an api call to https://graph.microsoft.com/v1.0/users/{id}/photo/$value . and i want to display it in an adaptive card that accepts a url. how can i do that

[v-kydela]

Thank you for the question, @afahmy11

Adaptive Cards can only display public images. They cannot access URL's that require authorization, though Matt Hidinger says they have plans to solve that problem.

In the meantime you have two options, though both are somewhat undesirable.

1. You can reupload the image to a public URL, which may be considered a security breach if the image is meant to be private.
2. If the image is very small, you can embed the image in the card. If you don't know how to do that, you should be able to find plenty of posts explaining how to use data URI's. Be warned that embedding images that aren't small enough will make the activity too large to be sent through the Bot Framework, and you'll see errors in that case.

If you have further questions, please feel free to ask them on Stack Overflow. I will close this issue as resolved.

[afahmy11]

thanks a lot v-kydela

i have used the below in my adaptive card and it works but i am still confused on how to add the variable where i stored the output of https://graph.microsoft.com/v1.0/users/{id}/photo/$value in the "url" line

``

    "type": "AdaptiveCard",
    "body": [
    {
        "type": "Image",
        "style": "Person",
        "url": "data:image/png;base64,iVBORw0KGgoAAA ANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4 //8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU 5ErkJggg==",
        "size": "Small"
    }

[afahmy11]

i tried "url": "data:image/png;base64,${user.photo}", but it is not working