HarveyHuBJ / active-directory-dotnet-webapi-onbehalfof

A .NET 4.5 MVC Web API protected by Azure AD that receives tokens from a client and uses ADAL to get tokens for calling the MIcrosoft Graph

services	platforms	author	level	client	service	endpoint
active-directory	dotnet	jmprieur	400	.NET Framework 4.5 Console, JavaScript SPA	ASP.NET Web API	AAD V1

Calling a downstream web API from a web API using Azure AD

About this sample

Overview

In this sample, the native client and a simple JavaScript single page application:

1. Acquire a token to act On Behalf Of the user.
2. Call a web API (TodoListService)
3. Which itself calls another downstream Web API (The Microsoft Graph)

The TodoListService uses a database to:

• Store the todo list

• Illustrate token cache serialization in a service

  

Scenario. How the sample uses ADAL.NET (and ADAL.js)

• TodoListClient uses Active Directory Authentication Library for .NET (ADAL.NET) to acquire a token for the user in order to call the first web API. For more information about how to acquire tokens interactively, see Acquiring tokens interactively Public client application flows.

• TodoListSPA, the single page application, uses ADAL.js. When the user enters a todo item, TodoListClient and TodoListSPA call TodoListService on the /todolist endpoint.

• Then TodoListService also uses ADAL.NET to get a token to act on behalf of the user to call the Microsoft Graph. For details, see Service to service calls on behalf of the user. It then decorates the todolist item entered by the user, with the First name and the Last name of the user. Below is a screen copy of what happens when the user named automation service account entered "item1" in the textbox.

  

Both flows use the OAuth 2.0 protocol to obtain the tokens. For more information about how the protocols work in this scenario and other scenarios, see Authentication Scenarios for Azure AD.

Looking for previous versions of this code sample? Check out the tags on the releases GitHub page.

How to run this sample

To run this sample, you'll need:

• Visual Studio 2017
• An Internet connection
• An Azure Active Directory (Azure AD) tenant. For more information on how to get an Azure AD tenant, see How to get an Azure AD tenant
• A user account in your Azure AD tenant. This sample will not work with a Microsoft account (formerly Windows Live account). Therefore, if you signed in to the Azure portal with a Microsoft account and have never created a user account in your directory before, you need to do that now.

Step 1: Clone or download this repository

From your shell or command line:

git clone https://github.com/Azure-Samples/active-directory-dotnet-webapi-onbehalfof.git

Given that the name of the sample is pretty long, and so are the name of the referenced NuGet pacakges, you might want to clone it in a folder close to the root of your hard drive, to avoid file size limitations on Windows.

Step 2: Register the sample with your Azure Active Directory tenant

There are three projects in this sample. Each needs to be separately registered in your Azure AD tenant. To register these projects, you can:

• either follow the steps in the paragraphs below (Step 2 and Step 3)
• or use PowerShell scripts that:
  • automatically create for you the Azure AD applications and related objects (passwords, permissions, dependencies)
  • modify the Visual Studio projects' configuration files.

If you want to use this automation, read the instructions in App Creation Scripts

First step: choose the Azure AD tenant where you want to create your applications

As a first step you'll need to:

1. Sign in to the Azure portal.
2. On the top bar, click on your account, and then on Switch Directory.
3. Once the Directory + subscription pane opens, choose the Active Directory tenant where you wish to register your application, from the Favorites or All Directories list.
4. Click on All services in the left-hand nav, and choose Azure Active Directory.

In the next steps, you might need the tenant name (or directory name) or the tenant ID (or directory ID). These are presented in the Properties of the Azure Active Directory window respectively as Name and Directory ID

Register the service app (TodoListService-OBO)

1. In the Azure Active Directory pane, click on App registrations and choose New application registration.

2. Enter a friendly name for the application, for example 'TodoListService-OBO' and select 'Web app / API' as the Application Type.

3. For the sign-on URL, enter the base URL for the sample, which is by default https://localhost:44321/.

4. Click on Create to create the application.

5. In the succeeding page, Find the Application ID value and copy it to the clipboard. You'll need it to configure the Visual Studio configuration file for this project.

6. Then click on Settings, and choose Properties.

7. For the App ID URI, replace the guid in the generated URI 'https://<your_tenant_name>/<guid>', with the name of your service, for example, 'https://<your_tenant_name>/TodoListService-OBO' (replacing <your_tenant_name> with the name of your Azure AD tenant)

8. From the Settings menu, choose Keys and add a new entry in the Password section:

   • Type a key description (of instance app secret),
   • Select a key duration of either In 1 year, In 2 years, or Never Expires.
   • When you save this page, the key value will be displayed, copy, and save the value in a safe location.
   • You'll need this key later to configure the project in Visual Studio. This key value will not be displayed again, nor retrievable by any other means, so record it as soon as it is visible from the Azure portal.

9. Configure Permissions for your application. To that extent, in the Settings menu, choose the 'Required permissions' section and then, click on Add, then Select an API, and type Microsoft Graph in the textbox. Then, click on Select Permissions and select User.Read.

Register the client app (TodoListClient-OBO)

1. In the Azure Active Directory pane, click on App registrations and choose New application registration.
2. Enter a friendly name for the application, for example 'TodoListClient-OBO' and select 'Native' as the Application Type.
3. For the Redirect URI, enter https://<your_tenant_name>/TodoListClient-OBO, replacing <your_tenant_name> with the name of your Azure AD tenant.
4. Click on Create to create the application.
5. In the succeeding page, Find the Application ID value and copy it to the clipboard. You'll need it to configure the Visual Studio configuration file for this project.
6. Then click on Settings, and choose Properties.
7. Configure Permissions for your application. To that extent, in the Settings menu, choose the 'Required permissions' section and then, click on Add, then Select an API, and type TodoListService-OBO in the textbox. Then, click on Select Permissions and select Access 'TodoListService-OBO'.

Register the spa app (TodoListSPA-OBO)

1. In the Azure Active Directory pane, click on App registrations and choose New application registration.
2. Enter a friendly name for the application, for example 'TodoListSPA-OBO' and select 'Web app / API' as the Application Type.
3. For the sign-on URL, enter the base URL for the sample, which is by default http://localhost:16969/.
4. Click on Create to create the application.
5. In the succeeding page, Find the Application ID value and copy it to the clipboard. You'll need it to configure the Visual Studio configuration file for this project.
6. Enable the OAuth 2 implicit grant for your application by choosing Manifest at the top of the application's page. Open the inline manifest editor. Search for the oauth2AllowImplicitFlow property. You will find that it is set to false; change it to true and click on Save to save the manifest.
7. Then click on Settings, and choose Properties.
8. For the App ID URI, replace the guid in the generated URI 'https://<your_tenant_name>/<guid>', with the name of your service, for example, 'https://<your_tenant_name>/TodoListSPA-OBO' (replacing <your_tenant_name> with the name of your Azure AD tenant)
9. Configure Permissions for your application. To that extent, in the Settings menu, choose the 'Required permissions' section and then, click on Add, then Select an API, and type TodoListService-OBO in the textbox. Then, click on Select Permissions and select Access 'TodoListService-OBO'.

Configure known client applications for service (TodoListService-OBO)

For the middle tier web API (TodoListService-OBO) to be able to call the downstream web APIs, the user must grant the middle tier permission to do so in the form of consent. However, since the middle tier has no interactive UI of its own, you need to explicitly bind the client app registration in Azure AD, with the registration for the web API. This binding merges the consent required by both the client & middle tier into a single dialog, which will be presented to the user by the client. You can do so by adding the "Client ID" of the client app, to the manifest of the web API in the knownClientApplications property. Here's how:

1. In the Azure portal, navigate to your TodoListService-OBO app registration, and open the manifest editor by clicking on Manifest.

2. In the manifest, locate the knownClientApplications array property, and add the Client ID of the client application (TodoListClient-OBO) as an element. After you're done, your code should look like the following snippet with as many GUIDs as you have clients: "knownClientApplications": ["94da0930-763f-45c7-8d26-04d5938baab2"]

3. Save the TodoListService manifest by clicking the Save button.

4. [Optionally] do the same with the ClientID of your single page JavaScript application's registration if you created it.

Step 3: Configure the sample to use your Azure AD tenant

In the steps below, ClientID is the same as Application ID or AppId.

Open the solution in Visual Studio to configure the projects

Configure the service project

1. Open the TodoListService\Web.Config file
2. Find the app key ida:Tenant and replace the existing value with your AAD tenant name.
3. Find the app key ida:Audience and replace the existing value with the App ID URI you registered earlier for the TodoListService-OBO app. For instance use https://<your_tenant_name>/TodoListService-OBO, where <your_tenant_name> is the name of your Azure AD tenant.
4. Find the app key ida:AppKey and replace the existing value with the key you saved during the creation of the TodoListService-OBO app, in the Azure portal.
5. Find the app key ida:ClientID and replace the existing value with the application ID (clientId) of the TodoListService-OBO application copied from the Azure portal.

Configure the client project

1. Open the TodoListClient\App.Config file
2. Find the app key ida:Tenant and replace the existing value with your AAD tenant name.
3. Find the app key ida:ClientId and replace the existing value with the application ID (clientId) of the TodoListClient-OBO application copied from the Azure portal.
4. Find the app key ida:RedirectUri and replace the existing value with the Redirect URI for TodoListClient-OBO app. For instance use https://<your_tenant_name>/TodoListClient-OBO, where <your_tenant_name> is the name of your Azure AD tenant.
5. Find the app key todo:TodoListResourceId and replace the existing value with the App ID URI you registered earlier for the TodoListService-OBO app. For instance use https://<your_tenant_name>/TodoListService-OBO, where <your_tenant_name> is the name of your Azure AD tenant.
6. Find the app key todo:TodoListBaseAddress and replace the existing value with the base address of the TodoListService-OBO project (by default https://localhost:44321/).

[Optionally] Configure the TodoListSPA project

If you have configured the TodoListSPA application in Azure AD, you want to update the JavaScript project:

1. Open the TodoListSPA\appconfig.js file
2. In the configvariable (which is about the Azure AD TodoListSPA configuration):

• find the member named tenant and replace the value with your AAD tenant name.
• find the member named clientId and replace the value with the Client ID for the TodoListSPA application from the Azure portal.
• find the member named redirectUri and replace the value with the redirect URI you provided for the TodoListSPA application from the Azure portal, for example, https://localhost:44377/.

3. In the WebApiConfigvariable (which is about configuration of the resource, that is the TodoListService):

   • find the member named resourceId and replace the value with the App ID URI of the TodoListService, for example https://<your_tenant_name>/TodoListService.

4. While running the SPA app in the browser, take care to allow popups from this app.

Step 4: Run the sample

Clean the solution, rebuild the solution, and run it. You might want to go into the solution properties and set both projects, or the three projects, as startup projects, with the service project starting first.

Explore the sample by signing in, adding items to the To Do list, Clearing the cache (which removes the user account), and starting again. The To Do list service will take the user's access token, received from the client, and use it to get another access token so it can act On Behalf Of the user in the Microsoft Graph API. This sample caches the user's access token at the To Do list service, so it does not request a new access token on every request. This cache is a database cache.

[Optionally], when you have added a few items with the TodoList Client, login to the todoListSPA with the same credentials as the todoListClient, and observe the id-Token, and the content of the Todo List as stored on the service, but as Json. This will help you understand the information circulating on the network.

About the code

The code using ADAL.NET is in the TodoListClient/MainWindow.xaml.cs file in the SignIn() method. See [More information][#More-information] below for details on how this work. The call to the TodoListService is done in the AddTodoItem() method.

The code for the Token cache serialization on the client side (in a file) is in TodoListClient/FileCache.cs

The code acquiring a token on behalf of the user from the service side is in TodoListService/Controllers/TodoListController.cs

The code for the Service side serialization (in a database) is in TodoListService/DAL/DbTokenCache.cs. you can see how it's referenced by the Controller in the CallGraphAPIOnBehalfOfUser() method.

How to deploy this sample to Azure

This project has two WebApp / Web API projects. To deploy them to Azure Web Sites, you'll need, for each one, to:

• create an Azure Web Site
• publish the Web App / Web APIs to the web site, and
• update its client(s) to call the web site instead of IIS Express.

Create and Publish the TodoListService-OBO to an Azure Web Site

1. Sign in to the Azure portal.
2. Click Create a resource in the top left-hand corner, select Web + Mobile --> Web App, select the hosting plan and region, and give your web site a name, for example, TodoListService-OBO-contoso.azurewebsites.net. Click Create Web Site.
3. Once the web site is created, click on it to manage it. For this set of steps, download the publish profile by clicking Get publish profile and save it. Other deployment mechanisms, such as from source control, can also be used.
4. Switch to Visual Studio and go to the TodoListService project. Right click on the project in the Solution Explorer and select Publish. Click Import Profile on the bottom bar, and import the publish profile that you downloaded earlier.
5. Click on Settings and in the Connection tab, update the Destination URL so that it is https, for example https://TodoListService-OBO-contoso.azurewebsites.net. Click Next.
6. On the Settings tab, make sure Enable Organizational Authentication is NOT selected. Click Save. Click on Publish on the main screen.
7. Visual Studio will publish the project and automatically open a browser to the URL of the project. If you see the default web page of the project, the publication was successful.

Update the Active Directory tenant application registration for TodoListService-OBO

1. Navigate to the Azure portal.
2. On the top bar, click on your account and under the Directory list, choose the Active Directory tenant containing the TodoListService-OBO application.
3. On the applications tab, select the TodoListService-OBO application.
4. From the Settings -> Reply URLs menu, update the Sign-On URL, and Reply URL fields to the address of your service, for example https://TodoListService-OBO-contoso.azurewebsites.net. Save the configuration.

Update the TodoListClient-OBO to call the TodoListService-OBO Running in Azure Web Sites

1. In Visual Studio, go to the TodoListClient-OBO project.
2. Open TodoListClient\App.Config. Only one change is needed - update the todo:TodoListBaseAddress key value to be the address of the website you published, for example, https://TodoListService-OBO-contoso.azurewebsites.net.
3. Run the client! If you are trying multiple different client types (for example, .Net, Windows Store, Android, iOS) you can have them all call this one published web API.

Update the TodoListSPA-OBO to call the TodoListService-OBO Running in Azure Web Sites

1. In Visual Studio, go to the TodoListSPA-OBO project.
2. Open TodoListSPA\appconfig.js. Only one change is needed - update the todo:TodoListBaseAddress key value to be the address of the website you published, for example, https://TodoListService-OBO-contoso.azurewebsites.net.
3. Run the client! If you are trying multiple different client types (for example, .Net, Windows Store, Android, iOS) you can have them all call this one published web API.

Create and Publish the TodoListSPA-OBO to an Azure Web Site

1. Sign in to the Azure portal.
2. Click Create a resource in the top left-hand corner, select Web + Mobile --> Web App, select the hosting plan and region, and give your web site a name, for example, TodoListSPA-OBO-contoso.azurewebsites.net. Click Create Web Site.
3. Once the web site is created, click on it to manage it. For this set of steps, download the publish profile by clicking Get publish profile and save it. Other deployment mechanisms, such as from source control, can also be used.
4. Switch to Visual Studio and go to the TodoListService project. Right click on the project in the Solution Explorer and select Publish. Click Import Profile on the bottom bar, and import the publish profile that you downloaded earlier.
5. Click on Settings and in the Connection tab, update the Destination URL so that it is https, for example https://TodoListSPA-OBO-contoso.azurewebsites.net. Click Next.
6. On the Settings tab, make sure Enable Organizational Authentication is NOT selected. Click Save. Click on Publish on the main screen.
7. Visual Studio will publish the project and automatically open a browser to the URL of the project. If you see the default web page of the project, the publication was successful.

Update the Active Directory tenant application registration for TodoListSPA-OBO

1. Navigate to the Azure portal.
2. On the top bar, click on your account and under the Directory list, choose the Active Directory tenant containing the TodoListSPA-OBO application.
3. On the applications tab, select the TodoListSPA-OBO application.
4. From the Settings -> Reply URLs menu, update the Sign-On URL, and Reply URL fields to the address of your service, for example https://TodoListSPA-OBO-contoso.azurewebsites.net. Save the configuration.

How To Recreate This Sample

First, in Visual Studio 2017 create an empty solution to host the projects. Then, follow these steps to create each project.

Creating the TodoListService Project

1. In Visual Studio 2017, create a new Visual C# ASP.NET Web Application (.NET Framework) project. In the next screen, choose the Web API project template. And while on this screen, click the Change Authentication button, select 'Work or School Accounts', 'Cloud - Single Organization', enter the name of your Azure AD tenant. You will be prompted to sign in to your Azure AD tenant. NOTE: You must sign in with a user that is in the tenant; you cannot, during this step, sign in with a Microsoft account.
2. Add the Active Directory Authentication Library (ADAL) NuGet, Microsoft.IdentityModel.Clients.ActiveDirectory, EntityFramework, and Microsoft.AspNet.WebApi.Cors to the project.
3. Add reference of the System.IdentityModel assembly in the project.
4. In the Models folder, add a new class called TodoItem.cs. Copy the implementation of TodoItem from this sample into the class.
5. In the Models folder, add a new class called UserProfile.cs. Copy the implementation of UserProfile from this sample into the class.
6. Create a new folder named DAL.In the DAL folder, add a new class called DbTokenCache.cs. Copy the implementation of DbTokenCache from this sample into the class.
7. In the DAL folder, add a new class called TodoListServiceContext.cs. Copy the implementation of TodoListServiceContext from this sample into the class.
8. Add a new class named Extensions in the project. Replace the implementation with the contents of the file of the same name from the sample.
9. Add a new, empty, Web API 2 Controller called TodoListController.
10. Copy the implementation of the TodoListController from this sample into the controller. Don't forget to add the [Authorize] attribute to the class.
11. In web.config make sure that the key ida:AADInstance, ida:Tenant, ida:ClientID, and ida:AppKey exist, and are populated. For the global Azure cloud, the value of ida:AADInstance is https://login.onmicrosoft.com/{0}.
12. In web.config, in <appSettings>, create keys for ida:GraphResourceId and ida:GraphUserUrl and set the values accordingly. For the global Azure AD, the value of ida:GraphResourceId is https://graph.microsoft.com, and the value of ida:GraphUserUrl is https://graph.microsoft.com/v1.0/me/.

Creating the TodoListClient Project

1. In the solution, create a new Windows --> Windows Classic Desktop -> WPF App(.NET Framework) called TodoListClient.
2. Add the Active Directory Authentication Library (ADAL) NuGet, Microsoft.IdentityModel.Clients.ActiveDirectory to the project.
3. Add assembly references to System.Net.Http, System.Web.Extensions, and System.Configuration.
4. Add a new class to the project called TodoItem.cs. Copy the code from the sample project file of the same name into this class, completely replacing the code in the file in the new project.
5. Add a new class to the project called FileCache.cs. Copy the code from the sample project file of the same name into this class, completely replacing the code in the file in the new project.
6. Copy the markup from `MainWindow.xaml' in the sample project into the file of the same name in the new project, completely replacing the markup in the file in the new project.
7. Copy the code from MainWindow.xaml.cs in the sample project into the file of the same name in the new project, completely replacing the code in the file in the new project.
8. In app.config create keys for ida:AADInstance, ida:Tenant, ida:ClientId, ida:RedirectUri, todo:TodoListResourceId, and todo:TodoListBaseAddress and set them accordingly. For the global Azure cloud, the value of ida:AADInstance is https://login.onmicrosoft.com/{0}.

Finally, in the properties of the solution itself, set both projects as startup projects.

Community Help and Support

Use Stack Overflow to get support from the community. Ask your questions on Stack Overflow first and browse existing issues to see if someone has asked your question before. Make sure that your questions or comments are tagged with [adal dotnet].

If you find a bug in the sample, please raise the issue on GitHub Issues.

To provide a recommendation, visit the following User Voice page.

Contributing

If you'd like to contribute to this sample, see CONTRIBUTING.MD.

This project has adopted the Microsoft Open Source Code of Conduct. For more information, see the Code of Conduct FAQ or contact [e-mail] with any additional questions or comments.

More information

For more information, see ADAL.NET's conceptual documentation:

• Recommended pattern to acquire a token
• Acquiring tokens interactively in public client applications
• Service to service calls on behalf of the user.
• Customizing Token cache serialization

For more information about how OAuth 2.0 protocols work in this scenario and other scenarios, see Authentication Scenarios for Azure AD.