Azure Active Directory - Create Applications, Add Scopes And Add API Access

What’s Azure Active Directory

Azure Active Directory or Azure AD is a cloud-based Identity and Access Management (IAM) solution provided by Microsoft. Azure AD can be used for many reasons like adding users to your directory, controlling access or even adding single sign-on (SSO) to your apps.

Create a new application for your API (My API APP)

Each time you have a web or native application which communicates with an API, you start thinking about how to protect it and how to implement the authentication and the authorization process. Azure Active Directory is a good alternative for making a solid and good solution for that. When using Azure Active Directory, the first thing you’ll have to do is create an application for your API on Microsoft Azure. So, let’s start!

Navigate to https://portal.azure.com and sign in using your own account. If you don’t have one, you can register for free and then you can access to try it out.

Azure Active Directory - Create Applications, Add Scopes And Add API Access

Microsoft Azure provides a set of services like SQL databases, virtual machines, Azure Cosmos DB etc. For your needs, you have to select the “Azure Active Directory” option on the left side menu.

As shown above, through Azure Active Directory space you can manage users, groups, applications, roles and many other things related to your organization. Now select “App registrations” and then click on “Register an application”:

After that, you must set your application name, your application type (Web app/API or native) and the sign-on URL, and finally click on Create.

After the creation process, Azure shows you the details of the application: display name, application type, the home page, application id, and object id.

Congrats! Your API’s application now is created on your Azure Active Directory.

Add scopes to your API app

Scopes are parameters used within the authentication process by the application to specify what access it needs, scopes are used also by the authorization server to know exactly what permissions it must return. For creating a custom scope, you can click on the Manifest button, then Azure will show you a JSON content which describes the application as shown below:

Now, navigate inside the JSON file to the “oauth2Permissions”. Inside this JSON section, you can add all scopes you’ll need for your application using the default model.

Let’s add a sample scope called “Todo.Read” of type “User”.

{
"adminConsentDescription": "Allow access to read all users' todo items.",
"adminConsentDisplayName": "Read access to todo items",
"id": "9e2ce07b-fbc9-4b0b-9e83-8d00da3a5e21",
"isEnabled": true,
"type": "User",
"userConsentDescription": "Allow access to read your todo items.",
"userConsentDisplayName": "Read access to your todo items",
"value": "Todo.Read"
}

So far, you created your API app and you defined a scope inside the Manifest JSON file. In the next step, I’ll show you how to create an application for the client side that will be called in «My Client APP».

Create a new application for your client (My Client APP)

Navigate to Azure Active Directory option again then select ”App registrations” and click on “New application registration”. Like you did for the first app created for your API, you must set your application name, your application type (Web app/API or native) and the sign-on URL of your application and finally click on create.

After the creation process, Azure shows you the details of the application: display name, application type,home page, application id and object id.

After that, you’ll need to set access for “My API APP”. So, let’s do it in the next section of our tutorial.

Set API Access to your API

On the same screen shown, after the creation process of your client app, click on “Settings” then “Required permissions”.

When you click on “Required permissions”, Azure portal will show you a list of applications for which your application has already required permissions, like Azure Active Directory.

Now, click on “Add” to add your API, then click on “Select an API”.

Here, Azure Portal will show you a list of applications that you can access through your client application.

Now, tap and looking for “My API App”, then select it.

When you select the “My API APP”, you have to select required permissions, so click on the second section called “Select permissions”. As shown below, there are two types of permissions: Application Permissions: Designed for autonomous apps that don’t need a signed-in user but need authorizations like services or APIs. Delegated Permissions: Designed for apps that have a signed-in user.

As you defined two scopes in the Manifest file of “My API App”, Azure will show you them under the Delegated Permission. Each selected delegated permission will be shown as scope inside the “Select permissions” section.

Click “select” then “done”.

Azure will display a notification to confirm the success of the process.

Click on “Grant Permissions” then “Yes” to confirm all permissions you selected.

Now if you navigate to “App registrations” and then click on “View all applications”, you will see the both of your applications created during our tutorial: “My Client APP” and “My API APP”:

Conclusion

During this tutorial, you created two applications on Azure Active Directory, added a “Todo.Read” scope to your API application, and set the API access to your client application. In the next tutorial, we will see how to implement authentication and authorization in our Angular application using OpenID Connect with the Azure Active Directory and My Client App.