If you are interested in Azure AD B2B, and especially in the self-service part, you may also be interested in deploying and testing the sample Azure AD GraphAPI B2B Web Portal. I’m one of those persons that falls into that category!
The sample Azure AD GraphAPI B2B Web Portal can be found here. A detailed instruction to configure and deploy can be found here.
Reasons for this blog post are:
- You should be good when starting from “App Registrations”, but if you start from “App Registrations (Preview)” (or whatever it will be called in the future), then some steps are slightly different and you may or may not understand what you need to do;
- The sample Azure AD GraphAPI B2B Web Portal may not work in the end, which needs fixing.
–
So, let’s get started while starting from “App Registrations (Preview)”
–
[Step 1] Determine Your Tenant ID
No changes in the steps
–
[Step 2] Registering The AAD B2B Admin Application
When creating a new registration for the AAD B2B Admin Application, go to the “App Registrations (Preview)” and click “New Registration”
- For the “user-facing display name for this application” enter for example “Azure AD B2B Admin Application”
- For the “Supported Account Types” choose “Accounts In This Organization Directory Only” (meaning, all user accounts and all guests accounts from this directory only)
- For the “Redirect URI” choose “Web” and as a URL specify “https://loopback” (will be updated later!)
- At the bottom click “Register”
Figure 1: Registering The Azure AD B2B Admin Application
–
Right after registering, it will open in the “Overview” node.
- Write down the “application ID” which is required later in the Web Application/App Service as the client ID for the admin application
Figure 2: Overview Details Of The Azure AD B2B Admin Application
–
Click on the “Authentication” node
- Make sure to check “ID Tokens” or you will have some fun later on!
- Click on SAVE at the top
Figure 3: Selecting The Required Token For The Implicit Grant Flow
–
Click on the “Certificates And Secrets” node
- Click on “New Client Secret”
Figure 4: The Certificates And Secrets Page
–
- As a “Description” enter for example “Azure AD B2B Admin Application Secret – Key 1”
- Select an expiration period that you are comfortable with
- Click ADD
Figure 5: Adding A Client Secret For The Azure AD B2B Admin Application
–
- Make sure to copy or write down the value as you will not have a chance to get it back later!
Figure 6: Client Secret Defined For The Azure AD B2B Admin Application
–
Click on the API Permissions node
- If correct, the “Delegated” permission for “Sign In And Read User Profile” is already configured
- Click on Add A Permission
Figure 7: API Permissions For The Azure AD B2B Admin Application
–
- On the new pane at the right that opens click on Microsoft Graph
Figure 8: Selecting The Microsoft Graph As The API To Grant Permissions To
–
-
If the “Delegated” permissions are not yet configured, click on “Delegated Permissions”, otherwise skip this step
-
Scroll down to User and expand User and select User.Read (“Sign In And Read User Profile”)
-
Click Add Permissions
Figure 9: Selecting Delegated Permissions
–
Figure 10: User Permissions To Assign As Delegated Permissions
–
- Click on Add A Permission
- On the new pane at the right that opens click on Microsoft Graph
Figure 11: Selecting The Microsoft Graph As The API To Grant Permissions To
–
- Click on “Application Permissions”
- Scroll down to Directory and expand Directory and select Directory.ReadWrite.All (“Read And Write Directory Data”)
- Scroll down to User and expand User and select User.ReadWrite.All (“Read And Write All Users’ Full Profiles”)
- Click Add Permissions
Figure 12: Selecting Application Permissions
–
Figure 13: Directory Permissions To Assign As Application Permissions
–
Figure 14: User Permissions To Assign As Application Permissions
–
[Step 3] Registering The AAD B2B Pre-AuthN Application
When creating a new registration for the AAD B2B Pre-AuthN Application, go to the “App Registrations (Preview)” and click “New Registration”
- For the “user-facing display name for this application” enter for example “Azure AD B2B Pre-AuthN Application”
- For the “Supported Account Types” choose “Accounts In Any Organization Directory And Personal Microsoft Accounts” (meaning, any user account from any Azure AD directory and any personal Microsoft Account) OR choose “Accounts In Any Organization Directory” (meaning, any user account from any Azure AD directory)
- For the “Redirect URI” choose “Web” and as a URL specify “https://loopback” (will be updated later!)
- At the bottom click “Register”
Figure 15: Registering The Azure AD B2B Pre-AuthN Application
–
Right after registering, it will open in the “Overview” node.
- Write down the “application ID” which is required later in the app service as the client ID for the pre-authN application
Figure 16: Overview Details Of The Azure AD B2B Pre-AuthN Application
–
Click on the “Authentication” node
- Make sure to check “Access Tokens” and “ID Tokens” or you will have some fun later on!
- Click on SAVE at the top
Figure 17: Selecting The Required Tokens For The Implicit Grant Flow
–
Click on the “Certificates And Secrets” node
- Click on “New Client Secret”
Figure 18: The Certificates And Secrets Page
–
As a “Description” enter for example “Azure AD B2B Admin Application Secret – Key 1”
- Select an expiration period that you are willing to accept
- Click ADD
Figure 19: Adding A Client Secret For The Azure AD B2B Pre-AuthN Application
–
- Make sure to copy or write down the value as you will not have a chance to get it back later!
Figure 20: Client Secret Defined For The Azure AD B2B Pre-AuthN Application
–
Click on the “API Permissions” node
- If correct, the “Delegated” permission for “Sign In And Read User Profile” is already configured
- If the “Delegated” permissions are not yet configured (otherwise skip this step)
- Click on “Click on Add A Permission”
- Click on “Microsoft Graph”
- Click on “Delegated Permissions”
- Scroll down to User and expand User and select User.Read (“Sign In And Read User Profile”
- Click Add Permissions
Figure 21: API Permissions For The Azure AD B2B Pre-AuthN Application
–
Figure 22: Selecting The Microsoft Graph As The API To Grant Permissions To
–
Figure 23: Selecting Delegated Permissions
–
Figure 24: User Permissions To Assign As Delegated Permissions
–
Click on the “Manifest” node
- Find the line "oauth2AllowImplicitFlow", and change "false" to "true". Don’t include quotes, just replace the word.
- Click SAVE
Figure 25: Editing The Manifest
–
[Step 4] Deploying The Web Application
No changes in the steps
–
[Step 5] Post Configuration Cleanup
No changes in the steps for the The Azure AD B2B Admin Application
However, for the The Azure AD B2B Pre-AuthN Application, you should specify 2 reply URLs instead of just 1.
The following Reply URLs must be specified:
Figure 26: Reply URLs For The Azure AD B2B Pre-AuthN Application
–
[Step 6] Trying It Out
Navigate to the URL of the Web Application and you will see the following
Figure 27: Notification The B2B Portal Requires Configuration By An Admin
–
After clicking on Admin Sign In on the right and signing in, you should see
Figure 28: Site Configuration Screen For The B2B Portal
–
…but if you see
Figure 29: Error Notification Something Is Wrong
–
Error
An error occurred while processing your request.
–
–
Something is really wrong (duh!)
–
Now retry it again until you need to authenticate, but don’t!. Now look at the URL which should be similar to the one below
Figure 30: The URL At The Time Of Authentication
–
It is expecting a response type of “code” and “id_token” for the client with ID as specified by the red arrow (which is the Application ID of the Admin application registration)
have you checked “ID Token” for the Admin application registration? If not, then go back and check it (Picture 3)
–
After changing that, retry and it should work!
–
In all three cases below, when the invited user logs in to /Profile">https://<Web_Application_URL>/Profile, everything is OK.
However, as soon as the user tries to sync its profile from its home tenant to the inviting tenant, you will experience the following:
… if the “ID Token” is not checked for the Azure AD B2B Pre-AuthN Application (Figure 17)
Figure 31: Error When The “ID Token” Is Not Selected For The Azure AD B2B Pre-AuthN Application
–
… if only one reply URL is configured (main URL for the web application) and not 2 as shown in figure 26
Figure 32: Error When The “ID Token” Is Not Selected For The Azure AD B2B Pre-AuthN Application
–
… if the “Access Token” is not checked for the Azure AD B2B Pre-AuthN Application (Figure 17)
Figure 33: Error When The “Access Token” Is Not Selected For The Azure AD B2B Pre-AuthN Application
–
Cheers,
Jorge
————————————————————————————————————————————————————-
This posting is provided "AS IS" with no warranties and confers no rights!
Always evaluate/test everything yourself first before using/implementing this in production!
This is today’s opinion/technology, it might be different tomorrow and will definitely be different in 10 years!
DISCLAIMER: https://jorgequestforknowledge.wordpress.com/disclaimer/
————————————————————————————————————————————————————-
########################### Jorge’s Quest For Knowledge ##########################
#################### http://JorgeQuestForKnowledge.wordpress.com/ ###################
————————————————————————————————————————————————————-