如何在UWP应用中通过Microsoft Graph API在PersonPicture显示用户登录头像？

实现步骤及代码示例： #

1. 确认权限与登录状态
   确保你的应用已完成用户登录流程，且获取的Microsoft Graph API访问令牌包含User.Read权限（获取用户头像需要该权限）。

2. 调用Graph API获取头像流
   通过HttpClient请求用户头像的二进制数据，端点为https://graph.microsoft.com/v1.0/me/photo/$value。

3. 转换流为BitmapImage并绑定到PersonPicture
   将获取到的流转换为BitmapImage，赋值给PersonPicture控件的ProfilePicture属性。

后台C#代码示例：

// 登录成功后调用此方法加载头像
private async Task LoadUserAvatarAsync(string accessToken)
{
    using (var httpClient = new HttpClient())
    {
        // 添加Bearer令牌到请求头
        httpClient.DefaultRequestHeaders.Authorization = 
            new System.Net.Http.Headers.AuthenticationHeaderValue("Bearer", accessToken);
        
        try
        {
            var response = await httpClient.GetAsync("https://graph.microsoft.com/v1.0/me/photo/$value");
            if (response.IsSuccessStatusCode)
            {
                // 将响应流转换为BitmapImage
                var imageStream = await response.Content.ReadAsStreamAsync();
                var bitmapImage = new BitmapImage();
                await bitmapImage.SetSourceAsync(imageStream.AsRandomAccessStream());
                
                // 赋值给PersonPicture控件
                MyPersonPicture.ProfilePicture = bitmapImage;
            }
            else
            {
                // 用户无头像时，控件会自动显示默认占位图，也可自定义处理
            }
        }
        catch (Exception ex)
        {
            // 处理请求异常，如令牌过期、网络错误等
        }
    }
}

XAML控件代码：

<PersonPicture x:Name="MyPersonPicture" 
               Width="100" 
               Height="100"
               PlaceholderImage="ms-appx:///Assets/DefaultAvatar.png"/>

注意事项： #

• 若用户未设置头像，Graph API会返回404状态码，此时PersonPicture会自动显示内置占位图，你也可以通过PlaceholderImage属性自定义默认头像。
• 确保访问令牌未过期，若令牌失效需重新获取。
• 在应用注册时，务必添加User.Read的委托权限，并在请求令牌时包含该权限范围。

内容的提问来源于stack exchange，提问作者flexxowner