Please reload

Recent Posts

Connect Microsoft Flow to B2C

June 23, 2017

Microsoft flow helps create workflows with simple drag and drop interface. You can learn more here. An example of a work flow is on receiving an email from a certain person create a file in onedrive.

 

For companies that publish web APIs, integrating the API as a custom connector with flow has the following benefits:

1. Customers can consume the API as part of their work flow.

2. Since flow designer has a drop and drag interface, it makes it easier for customers to consume the API.

 

One of the challenges in integrating an API with flow is authentication.

 

The customers could be coming from several different domains. It is difficult to configure the web API to accept tokens from all these domains. B2C can drastically simplify the architecture. The web API only needs to accept token from B2C.

 

Here is the architecture:

 

 

 This assumes that contoso uses B2C to authenticate their customers.

 

Here are the steps to make this connection work. 

 

Create the required apps in B2C of contoso's tenant

2 apps need to be created. One app to model the flow designer and another app to model the web api.

First sign into Azure AD B2C tenant.

Step 1 - Model the web api - Click applications -> click add -> select web app. Give a name. The reply url is not important for this. But fill out the app id uri. In this example we have enterred webapp in the app id uri text field. Leave all the others default. Click create. Save the displayed application id. Also copy the appid uri that is displayed at the bottom.

 

Step 2 - Model the flow designer app. Click applications -> click add -> select web app. Give a name. Let us call it flow app. Add https://msmanaged-na.consent.azure-apim.net/redirect as the reply url. This is the url to redirect back into the flow designer. This url is obtained from flow app. Click create. Save the application id. Click keys and save the secret to be used later.

 

Step 3 - Create a sign in policy. Instructions are here . Once the policy is created copy the name(including B2C_1_ portion)

 

Step 4 - Create the web API. Secure it with B2C token. The details are not covered here. But there are many other blogs that cover this. 

 

Step 5 - Create the flow connector. Login to flow.microsoft.com. Click on the gears icon at the top right corner and click custom connector -> Create custom connector. The instructions for creating this are better explained at flow.microsoft.com. Let us focus on the authentication portion. Select Oauth2. Select Generic Oauth2 for identity provider. Paste the client id and secret(key) for the flow app from step 1(not the web app) in here. 

 

For the authorize url use the following(replace tenant id with yours. Note this is not the guid, but the name of the tenant like contoso.onmicrosoft.com. Replace the policy id with the one obtained in step 3)

https://login.microsoftonline.com/te/<Tenant_ID>/<Policy_Name>/oauth2/v2.0/authorize

For the token and refresh url use the following:

https://login.microsoftonline.com/te/<Tenant_ID>/<Policy_Name>/oauth2/v2.0/token

 

For scope paste url from step 1.

 

This completes the authentication portion.

 

Once the connector is created this can be shared with the customer(There is a process to do this. The flow website has more information on this)

At this point the customer can use the flow. Following are the instructions to consume them:

Create a connection. Click on the gear, click connections-> Create connection. Choose the connector. The user is directed to login. Flow redirects the user to B2C. After successfully authenticating, the user can use this connector in their flow.  

 

If you have more questions feel free to post a comment here. Or reach out to us at info at gritsoftwaresystems dot com.

Share on Facebook
Share on Twitter
Please reload

Follow Us
Please reload

Archive
  • Facebook Basic Square
  • Twitter Basic Square
  • Google+ Basic Square