Using MSAL angular to authenticate a user against azure ADB2C via authorization code flow with Proof Key for Code Exchange.

Previously, I switched from using oidc-client to MSAL Angular to integrate an Angular app with Azure AD for authentication. If you’re interested, you can read more here. More recently, I used MSAL Angular again to connect another application, but this time to an Azure AD B2C tenant. Since I had prior experience and Microsoft provided good documentation and sample projects to follow, connecting to Azure AD B2C using MSAL Angular was not too difficult. In this post, I share how I adapted the sample project provided by Microsoft to integrate the application with our Azure AD B2C tenant and describe a few minor obstacles that I encountered.

Common frameworks, libraries and design patterns I use

In this short post, I share some of the core frameworks, libraries and design patterns I worked with on a regular basis.

Migrating from Microsoft.AspNetCore.Authentication.AzureAD to Microsoft Identity Web authentication library to integrate with Azure AD.

I recently had a chance to clean up some of the deprecated libraries I used for validating a JWT access token or obtain one via the client-credentials flow or the on-behalf-of flow. The libraries I used were under the Microsoft.AspNetCore.Authentication.AzureAD packages. Per the document, since ASP.NET core 5.0, users should use the Microsoft.Identity.Web package to integrate with Azure AD and Azure ADB2C.

Integrate Azure AD B2C reset password user flow in angular using oidc-client-js.

This post continues from previous posts which I go over using oidc-client-js to interact with azure adb2c:

• Integrate a sign up / sign in user flow to authenticate a user against azure adb2c
• Integrate a edit-profile user flow.

In this post, I’m going to share how to handle resetting password.

You can find the sample project here.

Notes on using Microsoft Graph SDK to manage users in an Azure AD B2C tenant.

I recently worked on migration users’ accounts in an existing SQL database to azure AD B2C. I found some helpful articles from Microsoft that document different migration approaches and offer example codes on using Microsoft Graph SDK to manage the users. You can find the links to these articles and sample projects in the References section.

For the most part, I did not have much troubles with the basic CRUD operations. However, I had a bit of difficulties working with custom attributes and retrieving a user by email. In this post, I’m going to share some tips and caveats I learned. In particular, I’ll discuss:

• The Microsoft Graph API permissions you need to manage the users.
• Caveat on UserPrincipalName attribute and retrieving a user by email.
• Setting and retrieving custom attributes in Azure ADB2C.

Integrate Azure AD B2C profile editing user flow in angular using oidc-client-js.

This post is a continuation of the blog post I wrote a couple months ago on how to authenticate user against Azure ADB2C from angular app using oidc-client-js. In that post, I discussed how to integrate AD B2C sign up and sign in flows to allow the user to authenticate against AD B2C. In this post, I’m going to show an example of integrating the editing profile user flow. You can find the accompanying sample project here.

I assume you have some basic understanding of angular and Rxjs and focus primarily on the aspects relating to integrating the edit user flow. If you have questions about the codes, feel free to reach out.

Also, check out the next post relating to oidc-client-js in which I go over handling password reset.

Using OAuth2 Client Credentials grant type in Azure ADB2C

In the past, I worked on a project in which we had had to registered applications in both regular azure AD and azure ADB2C tenants just because OAuth2 Client Credentials grant type was not supported in Azure ADB2C. However, I recently learned that it is now possible to use the grant type to obtain an access token for an app in azure ADB2C.

Continue reading

How to authenticate user against Azure ADB2C from Angular app using oidc-client-js.

In this post, I show you how to authenticate your user against azure adb2c to obtain an id and access token. Specifically, we’ll discuss the following:

• Create azure adb2c directory
• Register applications in b2c tenant.
• Define scopes and setup permissions.
• Setup sign up and sign in user flow.
• Authentication service.
• Response to authentication events in component.

Please checkout the latest codes for this post here.

Also, check out the follow-up posts relating to using oidc-client-js to interact with Azure ADB2C:

• Integrate Azure ADB2C edit-profile user flow.
• Integrate Azure ADB2C reset-password user flow.

Continue reading