[FIXED] Where to implement Azure AD B2C with React frontend and ASP.NET Core 6 backend

Issue

I am looking to implement Azure AD B2C into my web application for user authentication.

However, I am unsure of the desired practice when you have a separate frontend from backend.

• Frontend: React JS web application running on Node.js
• Backend: ASP.NET Core 6 API application
• Server: Microsoft SQL Server

I would like to also have users / user information stored in the database upon creation. This is because I need to reference these users in several different relational tables.

What is the best workflow with this?

1. Azure AD B2C is implemented in frontend. When a user is created, an API request is sent to the backend to create the user in the database. If it is successful, a user cookie is created on the frontend for authentication.
2. Azure AD B2C is implemented in the backend. When a user is submitted in the frontend, an API request is sent to the backend where the Azure AD B2C service creates a user, stores it in the database, and sends a callback to the frontend signifying the action was either successful / unsuccessful, along with a user cookie for authentication.
3. other

I am new to authentication cookies, and user sessions, so any documentation provided regarding that would be greatly appreciated.

Solution

• I would suggest you use ASP .NET MVC 2 or another version as the front-end client and integrate Azure AD B2C tenant and an app registered in it as described in the document below. Once you have the Azure AD B2C tenant registered and the required application for authentication configured, configure the custom policies and user flow accordingly. Once those are done, then secure that application with Azure AD B2C for login and authentication with guest authentication. Then, ensure that your backend application is integrated with Azure SQL or cosmos DB for storing the details of all the users signed in with the Azure AD B2C. For that purpose, you will have to give Azure AD B2C application registration, the required permissions for that concerned Azure resource for allowing to access the same and retrieve the user details from it. Thus, in this way, you can configure your application accordingly.

Kindly refer to the link below for more information and details on configuring the infrastructure for the same: -

https://www.codeproject.com/Articles/1121503/Integrate-Azure-AD-B-C-with-ASP-NET-MVC-Web-App-Pa

https://docs.microsoft.com/en-us/azure/active-directory-b2c/configure-authentication-sample-web-app?tabs=visual-studio

Answered By - Kartik Bhiwapurkar

Answer Checked By - Terry (PHPFixing Volunteer)