In this post, we will be adding access to user profiles using Azure B2C. We will be building on the setup used in the ASP.NET Core with Azure B2C Auth post so make sure and check it out if something in this post isn’t clear. The following is the full list of post from what has turned in to a series on Azure B2C.
ASP.NET Core with Azure B2C Auth
Azure B2C: Customize Layouts
Azure B2C: Social Logins
User Profile Flow
The first step to enabling profile access is to add the Profile editing user flow. From the menu for your Azure B2C resource select User flows.
At the top of the list of user flows click the New user flow button. This will display a list of recommended flows to add. From the list click Profile editing.
On the Create page enter a Name for your flow, select which Identity providers can use the flow, select which User attributes to collect/display, and then create the Create button. The user attributes you select will control which fields show when the user is editing their profile. Also, notice the Show more link which will give you a full list of the user attributes available on your account.
Sample Application
Back in the sample application in the appsettings.json file enter the name of the profile editing user flow from above for the EditProfilePolicyId.
"EditProfilePolicyId": "B2C_1_Profile"
Run the application and after login, the user’s name will be a link which will take them to a page where they can edit their profile information.
The following is a sample of what the profile page looks like.
Tweaking the Layout
From the screenshot, you will notice that the order of the fields wouldn’t make a lot of sense to a user. Thankfully B2C provides a way to customize the order of files, labels, control types, etc. without doing a full custom page which is also an option if you need to match an existing application’s look and feel.
From the B2C menu, select User flows and click on your profile flow. Once in your profile flow select Page layouts and then in the details select Profile edit page.
You will see something similar to the following screenshot. As you can see it allows reordering of fields, label changes, etc.
User Attributes
If the built-in user attributes don’t cover all your needs B2C does allow you to add your own attributes. From the main menu of B2C click on User attributes and you will see a list of your current attributes as well as an Add button if you need a custom attribute.
Wrapping Up
Enabling profile access was a pretty easy process and the flexibility provided with the built-in customizations is nice. I’m betting that most people will end up using a custom layout to give users a consistent experience. If you need help getting started with a custom layout check out my Azure B2C: Customize Layouts post.
Also published on Medium.