[pnpjs - graph - user] Unable to retrieve specific dimension for profile picture using pnpJS

[MozzaikJD]

What version of PnPjs library you are using

3.x

Minor Version Number

3.20.1

Target environment

Browser App (Hosted external to Microsoft 365 platform)

Additional environment details

N/A

Question/Request

Hello pnpJS community,

I am trying to retrieve a specific dimension for a user's profile picture using pnpJS, but I am unable to find any options to do so. Currently, I am using the following code to retrieve the profile picture:

Graphfi.using(CacheNever()).users.getById(userId).photo

This generates the following call: https://graph.microsoft.com/v1.0/users/{user-id}/photo/$value

However, I would like to be able to retrieve a specific dimension for the profile picture, such as 120x120, which can be achieved using the following endpoint in Graph: (photoS)

https://graph.microsoft.com/v1.0/users/{user-id}/photos/120x120/$value MS Documentation

I would appreciate any help or advice on how to retrieve a specific dimension for the profile picture using pnpJS.

Thank you!

[bcameron1231]

Unfortunately, we do not support this with our native methods. However you can make the call yourself using PnPjs.

Check out this documentation on how to extend the library to call any endpoint you want. https://pnp.github.io/pnpjs/concepts/calling-other-endpoints/

Here is a quick code sample.

 const user = graph.users.getById('beau@tenant.onmicrosoft.com');
 var photoValue = await graphGet(GraphQueryable(user, "photos/120x120/$value").using(BlobParse()));
 const blobUrl = URL.createObjectURL(photoValue);
 document.getElementById("photoElement").setAttribute('src', blobUrl);

[MozzaikJD]

Thanks @bcameron1231, for your quick and detailed response. I was able to successfully retrieve my photo using the method you suggested. I appreciate the code sample and the link to the PnPjs documentation, they were very helpful.

I understand that there's currently no native method to retrieve photos in specific formats. I look forward to any potential updates in the future that might include this feature.

Once again, thank you for your assistance!

[bcameron1231]

Hi. It was just released :) Version 3.21.0 (this is why we closed your issue).

[github-actions[bot]]

This issue is locked for inactivity or age. If you have a related issue please open a new issue and reference this one. Closed issues are not tracked.