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.

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.

Why the implicit flow is no longer recommended for protecting a public client.

In his post on The State of the Implicit Flow in OAuth2, Brook Allen mentions several reasons why OIDC/OAuth2 implicit flow is no longer a recommended approach to protect a public application and discusses using Oauth2 authorization code grant with Proof key for code exchange (PKCS) if the client and the resource server run on different domains, or simply using cookie based authentication with same-site cookie policy if the client and resource server run on a same domain. This post is my notes on what I have learned after reading Brook Allen’s post and also the related documents from Internet Engineering Task Force about the security risks of using OAuth2 implicit flow.

Continue reading

Configure OAuth2 implicit flow for Swagger UI

In this post, I share some example codes of how to enable OAuth2 implicit flow within Swagger UI to obtain an access token from Microsoft Identity Framework (v2.0 endpoint).

Continue reading

Pass user’s identity and authorization from a client application to a web API to another web API using OAuth 2.0 On-Behalf-Of flow.

A few months ago, I gave an overview of the libraries I use to implement OpenID Connect implicit flow in an angular app, and On-Behalf-Of (OBO) flow in ASP.NET core backend APIs. You can checkout this post for more info. In that post, I talk about the security flow from the angular app to the downstream APIs. The angular app communicates only with a single backend API which acts as a gateway that forwards the requests from to other downstream APIs.

In this post, I go over the details of obtaining an access token via the OBO flow to call protected endpoints from a web API (which I refer to as the gateway in this post) to another web API .

Continue reading

Using oidc-client-js to obtain tokens from Azure AD (v1.0) or Microsoft identity platform (v2.0) .

In my previous post, I mention using MSAL for angular to implement implicit flow in angular application. However, MSAL is still in preview and I could not get it to work in IE 11. In addition, I could not find a way to obtain both access and id tokens in a single call. I have switched to oidc-client-js. Besides adding the polyfills for IE, I did not have to do much for oidc-client-js to run in IE11. The library also allows me to configure response_type parameter of a request to the authorization endpoint to obtain both id and access tokens in one call. Overall, I have found the library to be more stable than MSAL for angular. In this post, I share how I configure oidc-client-js in an angular application to obtain tokens from Azure Active Directory (v1.0 endpoint) as well as some of the lessons I have learned.

Continue reading

OIDC implicit flow in angular with MSAL for angular, Microsoft Identity Platform (v2.0) and Azure AD.

In this post, I share my experience about doing OpenID Connect (OIDC) implicit flow using Microsoft Authentication library (MSAL) for Angular, Microsoft Identity Platform (v2.0), and Azure AD. This post is part of the blog post series in which I cover implementing OIDC flows to protect as system that consists of an angular front-end application and asp.net core web apis. In the previous post, I give a high level overview of the technologies involved in protecting such a system.

Continue reading