Forum Discussion
How to create an <img> tag containing MSGraph photo/$value response BLOB
I'm creating a Sharepoint Application (using Shrepoint Framework) and I'm not being able to retrieve the Pohto BLOB returned when calling MSGraph "/me/photo/$value" api. I don't know how to convert the BLOB into a Base64 string. I know that the responseraw.body is a readable stream, but don't know hot to access it and use as a SRC of a IMG tag. I have made many attempts, I'm writing one to explain what I'm trying to accomplish:
this.context.msGraphClientFactory .getClient()
.then((client: MSGraphClient): void => {
client.api('/me/photo/$value')
.get((error, response: any, rawResponse?: any) => {
const blobUrl = window.URL.createObjectURL(rawResponse.body);
document.getElementById("myPhoto").setAttribute("src", blobUrl);
});
});
This code fails because creteObjectURL has been deprecated. The MSGraph call works, but I can't process the response. Any suggestions?
- Carlos_MarinsIron Contributor
Hi carles1964,
Hope it's not too late. I ran into this issue yesterday and no matter what I tried I couldn't get the image BLOB.
In my case, I needed to get several images, so I switched to a single batch call. Turns out the image results come as base64 when you make a batch request, so that solved my problem. You can try to make a single request in a batch and try to get the result. It is not a perfect solution, but I hope it can solve your problem. Let me know if you need any help.