How to get microsoft account profile photo after login with application in mvc

Viewed 1418

With the help of claimprincipal, I'm able to get the details of signedin user as below but its not giving any pic related information as google does:

https://apis.live.net/v5.0/{USER_ID}/picture?type=large

which says The URL contains the path '{user_id}', which isn't supported. Even tried

https://graph.microsoft.com/v1.0/me/photo/$value

which is asking for access token, but I am not sure what have to be passed

string userName = ClaimsPrincipal.Current.FindFirst("name").Value;
string userEmail = ClaimsPrincipal.Current.FindFirst(ClaimTypes.Email).Value;
string userId = ClaimsPrincipal.Current.FindFirst(ClaimTypes.NameIdentifier).Value;

Wanted an image which was added in any outlook account

2 Answers

For Image to show.. We have to use beared token and have to convert the image into memory stream and then have to used it.. I have done it in below ways. Hope this help ...

 var client = new RestClient("https://login.microsoftonline.com/common/oauth2/token");
                        var request = new RestRequest(Method.POST);
                        request.AddHeader("cache-control", "no-cache");
                        request.AddHeader("content-type", "application/x-www-form-urlencoded");
                        request.AddParameter("application/x-www-form-urlencoded", $"code={code}&client_id={OutClientId}&client_secret={SecretKey}&redirect_uri={OutRedirectUrl}&grant_type=authorization_code", ParameterType.RequestBody);
                        IRestResponse response = client.Execute(request);
                        Token jsonContent = JsonConvert.DeserializeObject<Token>(response.Content);

                        var Token = jsonContent.AccessToken;
                        var TokenType = jsonContent.TokenType;
                        HttpClient httpClient = new HttpClient();
                        httpClient.DefaultRequestHeaders.Authorization = new AuthenticationHeaderValue("Bearer", Token);
                        HttpResponseMessage response1 = await httpClient.GetAsync("https://graph.microsoft.com/v1.0/me/photos/96x96/$value");
                        if (response1.StatusCode == HttpStatusCode.OK)
                        {
                            using (Stream responseStream = await response1.Content.ReadAsStreamAsync())
                            {
                                MemoryStream ms = new MemoryStream();
                                responseStream.CopyTo(ms);
                                byte[] buffer = ms.ToArray();
                                string result = Convert.ToBase64String(buffer);
                                HttpContext.Session[AppConstants.UserImage] = String.Format("data:image/gif;base64,{0}", result);
                                responseStream.Close();
                            }
                        }

Is there any reason you are using the live.net apis? Instead of the Microsoft Graph APIs? Microsoft Graph APIs are the future for all user data within Microsoft 365 consumer and commercial accounts.

You can get the Users photo very easily as described here https://docs.microsoft.com/en-us/graph/api/profilephoto-get?view=graph-rest-1.0

GET /me/photo/$value

As you are using ASP.NET MVC, there is an SDK you can use that makes this very easy too. https://docs.microsoft.com/en-us/graph/sdks/sdks-overview?context=graph%2Fapi%2F1.0&view=graph-rest-1.0

Related