From Azure Function (secured by AAD), how to properly detect the caller (the end-user of SPFx WebPart) through the AadHttpClient?

Question

Note: Both Azure Function and the SPFx WebPart mentioned below are written in NodeJS/JavaScript. None of them are in C#.

I have an Azure Function (secured by AAD: App Registration) which is being called by AadHttpClient via SPFx WebPart on a SharePoint page. The SPFx codes look like this:

return new Promise<void>((resolve: () => void, reject: (error: any) => void): void => {
    this.context.aadHttpClientFactory.getClient("XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX") // <--- This is the AAD Client App Id.
    .then((client: AadHttpClient): void => {
        
        client.post("https://myAzureFunctionName.azurewebsites.net/api/HttpTrigger1", AadHttpClient.configurations.v1, {
            body: JSON.stringify({
                data: someData
            })
        })
        .then((res: HttpClientResponse): Promise<any> => {
            return res.json();
        })
        .then((response: any): void => {
            console.log("SUCCESSFUL API RESPONSE:", response); // <--- At this point, I get the respond back from the Azure Function, successfully.
            resolve();
        }, (err: any): void => {
            console.error(err);
        });

    }, err => reject(err));
});

It is working fine except from the Azure Function end, I don't know how to properly detect who/which current SharePoint User is calling this API. The only dirty trick I can use is, of course, to attach the User Information, such as Email Address, (retrieved from _spPageContextInfo object) into the AadHttpClient API call, to the Azure Function.

Question

• Is there a proper/authentic way where I can detect the caller (the currently logged in, end-user of SPFx WebPart) through the AadHttpClient, from the Azure Function end? So that I can use the user's Email Address further in the Azure Function.

Appreciate the helps in advance.

Answer 1

• You can obtain identity details using ClaimsPrincipal object.

• The most straightforward method is to obtain the ClaimsPrincipal object from the Function's binding parameters.

• Include the ClaimsPrincipal as an additional parameter in the function signature.

• The object will be automatically injected, similar to how ILogger is injected.

• Sample code

using Microsoft.AspNetCore.Http;
using Microsoft.AspNetCore.Mvc;
using Microsoft.Azure.WebJobs;
using Microsoft.Azure.WebJobs.Extensions.Http;
using Microsoft.Extensions.Logging;
using System.Security.Claims;

// DEMO: Get ClaimsPrincipal as a binding parameter
namespace ClaimsDemo.Function
{
    public static class ClaimsDemo
    {
        // Pass ClaimsPrincipal parameter in the function signature
        [FunctionName("ClaimsDemo")]
        public static IActionResult Run
            ([HttpTrigger(AuthorizationLevel.Anonymous, "get", "post", Route = null)]
             HttpRequest req, ILogger log, ClaimsPrincipal claimIdentity)
        {
            log.LogInformation("User ID: " + claimIdentity.Identity.Name);
            
            log.LogInformation("Claim Type : Claim Value");

            foreach (Claim claim in claimIdentity.Claims)
            {
                log.LogInformation(claim.Type + " : " + claim.Value + "\n");
            }

            return new OkObjectResult("Success");
        }
    }
}

User Claims from the Request Headers

• App Service passes user claims to the app by using special request headers.

X-MS-CLIENT-PRINCIPAL-ID --User ID
X-MS-CLIENT-PRINCIPAL-NAME --User Name
X-MS-CLIENT-PRINCIPAL-IDP --Identity Provider's ID
X-MS-CLIENT-PRINCIPAL --Claims

//Extract User ID and Claims from the request headers
var principal_name = req.Headers["X-MS-CLIENT-PRINCIPAL-NAME"].FirstOrDefault();
var principal_Id = req.Headers["X-MS-CLIENT-PRINCIPAL-ID"].FirstOrDefault();
string easyAuthProvider = req.Headers["X-MS-CLIENT-PRINCIPAL-IDP"].FirstOrDefault();
string clientPrincipalEncoded = req.Headers["X-MS-CLIENT-PRINCIPAL"].FirstOrDefault();

• Similar thread present at below link

  User Identity in Azure function

Answer 2

You could make a call to the SharePoint REST API or the Microsoft Graph to get the full user profile in your Azure Function.

REST: /_api/SP.UserProfiles.PeopleManager/GetMyProperties

Graph: /me

To get the bearer token needed to make the call to get the user profile, you use the ConfidentialClientApplication.AcquireTokenOnBehalfOf method. You can do this using the following C# code inside your Azure Function. I don't know how to do the equivalent in Node.js.

var tenantName = "your tenant name";
var impersonationToken = req.Headers.Authorization.Parameter;

var clientId = "app client Id";
var clientSecret = "app client secret";
var authority = $"https://login.microsoftonline.com/{tenantName}.onmicrosoft.com";
var userAssertion = new UserAssertion(impersonationToken);

var azureApp = ConfidentialClientApplicationBuilder.Create(clientId)
    .WithAuthority(authority)
    .WithClientSecret(clientSecret)
    .Build();

var scopes = new string[] { "User.Read" };
var authResult = await azureApp.AcquireTokenOnBehalfOf(scopes, userAssertion)
    .ExecuteAsync();
var token = authResult.AccessToken;