In SharePoint Framework version 1.4, they introduced the new MSGraphClient, which makes your live a lot easier when you need to call the Microsoft Graph. For reference sake, getting access to the MSGraphClient can be done as follows.
import { WebPartContext } from '@microsoft/sp-webpart-base';
import { MSGraphClient } from '@microsoft/sp-client-preview';
export class DataService implements IDataService {
private msGraphClient: MSGraphClient;
constructor(private context: WebPartContext) {
this.msGraphClient = context.serviceScope.consume(MSGraphClient.serviceKey);
}
}
When you need to call the Microsoft Graph, but the result is not a json object, but an image. Then you probably want the result as a blob. This can be achieved by using the responseType method as follows.
public GetImage(id: string): Promise<string> {
return this.msGraphClient
.api(`/users/${id}/photos/48x48/$value`)
.responseType('blob')
.get()
.then((blob: Blob) => {
return blob ? URL.createObjectURL(blob) : null;
});
}