CODEWITHSUNDEEP
reactjs.net-coreazure-active-directorymicrosoft-graph-apiazure-ad-msal
apriestley
apriestley

Reputation: 55

Configuration of React app, .NET Core 3.1 API, and calls to Microsoft Graph

Is there a "best" way of achieving this?

Basically I want to leverage my company's Azure AD tenant to build a fully featured internal application. Using Microsoft Graph, I can retrieve users via their identifier guids, and use the identifiers as foreign keys for various tables in our on premises database, instead of having a dedicated User table, which would need to be populated and synced up with the AD. There are many other prospective uses for Graph, but leveraging users is the priority right now.

A large chunk of my application is built already. I am able to lock down my client app using the package react-aad-msal, requiring users to authenticate through single-sign-on. I have also successfully been able to pass that token back to the protected .NET Core API, accessing various endpoints as the authenticated user.

From here, I am not sure how I can develop the calls to Microsoft Graph. At which point should I make the connection? Should the client application connect to both the on-prem API, as well as Graph? Or should it only connect to the on-prem, which would then connect to Graph? Curious to know the pros and cons of either method.

I've also heard tell that Microsoft is working on their own package: @azure/msal-react, and that react-aad-msal should no longer be used (as it only supports msal 1.0 and not 2.0. I have no idea which version is better for my needs). While msal-react is still in development, apparently I should be using @azure/msal-browser. But I cannot find a good example of a react app using msal-browser to authenticate.

Upvotes: 0

Views: 887

Answers (1)

Sri Hari Krishna Yalamanchili
Sri Hari Krishna Yalamanchili

Reputation: 2447

Here is a Sample on how to use MSAL with React to call Microsoft Graph.

The only different in your case will be that instead of calling Microsoft Graph, you will call your own API.

Bottomline is - there is no direct integration package yet for react. Which can also be read from the official statement on the msal-js repo:

After our current libraries are up to standards, we will begin balancing new feature requests, with new platforms such as react and node.js.

You can also use .net core instead. Please go through the sample here which can help.

Upvotes: 1

Related Questions