How to set up Azure Active Directory to Perform Authentication using Single Sign-On

This section explains how to perform Single Sign-On for users in Azure Active Directory with Syncfusion User Management Server.

NOTE

This configuration has been done using the Azure Portal

Steps to Set Up Azure Active Directory

Prerequisites

• An Azure account with Active Directory support
• Install Syncfusion User Management Server and Login with Administrator account

Setup Azure Active Directory Application

Login to the Azure portal. Create Azure Active Directory.

1. Click Create a resource and search Azure Active Directory as follows.

   

2. Click Create in the following screenshot.

   

3. In the dialog box, enter the Name, Domain Name and choose the Country or Region, and then click Create.

   

The application will be added to the directory and you can view the details of the application in the App registrations.

In this directory, you should add three applications. An application acts as a Web API Server (User Management Server), and the other two applications act as native client applications (Dashboard Designer and Syncfusion Dashboards mobile app).

1. Enter into the created directory and click Azure Active Directory, and then select App Registrations.

2. Now, click New application registration to add a new application.

   

3. Enter the name of the application and choose Web app/API as Application type and enter the sign-on URL.

   

4. To view all registered applications, click Azure Active Directory and select App registrations, and then choose All apps.

   

5. Choose the registered application and click Settings.

   

6. Select Properties and enter the App Id URI and Home page URL.

   

7. Click Save as highlighted in the above screenshot.

NOTE

The Sign-on URL and the App ID URI should be the URL of the Syncfusion User Management Server application.

Now, you can add Microsoft Graph application to your application to import the users and groups into the Syncfusion Dashboard Server.

1. Go to application, click Settings, and select the Required permissions. Then click Add and click Select an API.

   

2. Select Microsoft Graph from the list and click Select.

   

   

3. Enable following permissions for dashboard server application

   • Microsoft Graph Application and Delegated Permissions

   Application Permissions
   Read directory data
   Delegated Permissions
   1. Read directory data
   2. Read all groups
   3. Sign in and read user profile
   4. Access directory as the signed in user

   • Windows Azure Active Directory Application and Delegated Permission

   Application Permissions
   Read directory data
   Delegated Permissions
   1. Read directory data
   2. Sign in and read user profile

4. After adding the permission, click the Grant Permission from the Required permissions section of the application page and select yes as below.

   

Configure Azure Active Directory to perform Single Sign-On in Dashboard Designer application

1. Enter into the created directory and click the Azure Active Directory. Then, select App registrations and click the New application registration to add a new application.

   

2. Enter the name of the client application and choose the Application type as Native and enter the Redirect URI.

   

3. Click Create. The client application will be added to the directory and you can view the details of the application in the App registrations.

NOTE

Redirect URI should be the URL of the Syncfusion User Management Server application.

1. To view all registered applications, click the Azure Active Directory and select App registrations, and then choose All apps.

   

   Now, you can add User Management Server application to the client application to enable Single Sign-On in native client application.

2. Choose the registered application and click the Settings.

   

3. Go to application, click Settings, and select Required permissions. Then click Add, and then choose Select an API.

   

4. Select the Syncfusion User Management Server from the list and click Select.

   

5. Select the delegated permission for accessing User Management Server and save it.

   

Configure Azure Active Directory to perform Single Sign-On in Syncfusion Dashboard Mobile application

1. Enter into the created directory and click Azure Active Directory. Select the App registrations and click New application registration to add a new application.

   

2. Enter the name of the client application and choose the Application type as Native, and then enter the Redirect URI.

   

3. Click Create, the client application will be added to the directory and you can view the details of the application in the App registrations.

   NOTE

   Redirect URI should be the URL of the Syncfusion User Management Server application.

4. To view all registered applications, click the Azure Active Directory and select App registrations, and then choose All apps.

   

   Now, you can add User Management Server application to the client application to enable Single Sign-On in native client application.

5. Choose the registered application and click the Settings.

   

6. Go to application, click the Settings, and select Required permissions. Then click Add, and then choose Select an API.

   

7. Select the User Management Server from the list and click Select.

   

8. Select the delegated permission for accessing the User Management Server and saving it.

   

Setup Azure Active Directory Users and Groups

By default, a root user sourced from the Microsoft account is added in the directory. You can add users to this directory and later it should be imported to the Syncfusion User Management Server to perform the Single Sign-On.

Setup Syncfusion User Management Server to Perform Single Sign-On

We need to configure the settings in Syncfusion User Management Server to perform Single Sign-On.

1. When you are in the same Azure Active Directory application (User Management Server) page, go to App registrations, and click Endpoints at the top, and a pop-up will be appeared as follows.

   

   

2. Start Syncfusion User Management Server and Log in with administrator account. Click on the Settings icon in the bottom left corner and click the SSO Settings.

   

3. To perform Single Sign-On with User Management Server, we need to configure the following fields in the Syncfusion User Management Server.

   • Metadata URI - Copy the text in the first text box named FEDERATION METADATA DOCUMENT and paste it.

   • Relying Party ID - The Default Site URL is already defined in this field. Copy this URL. Go to CONFIGURE menu of the Server application you created in the Azure. Paste the URL in Sign-on URL, App ID URI, Reply URL and save the application.

4. Configure the following fields in the Syncfusion User Management Server to perform Single Sign-On with Dashboard Designer.

   • Authority - From the Azure application, click on the VIEW ENDPOINTS and the pop up will appear. Copy the text in the second text box named WS-Federation Sign-On Endpoint and paste it.

   • Tenant Name - Go to the created Azure Active Directory and copy the domain name by clicking it as shown in the following image.

     

   • Designer Client Id - Go to the registered application and click the Settings. Then, copy the Application Id and paste it.

     

   • Mobile App Client Id - The Client Id of the Syncfusion User Management client application is created in the Azure Active Directory.

5. Now click on Save button. Once the values are saved, the application is Restarted in order to apply the settings.

Setup Syncfusion User Management Server to Import Azure Active Directory Users and Groups

1. Go to the Active Directory Settings page in Syncfusion User Management Server and click on the Azure Active Directory tab.

1. To import Azure users and groups, we need to configure the following fields in the Syncfusion User Management Server.

   • Tenant Name - Go to the created Azure Active Directory and copy the domain name by clicking it as follows.

     

   • Client Id - Go to the registered application and click the Settings, and then copy the Application Id and paste it.

     

   • Client Secret Code - Go to the Settings and click Keys, and then enter the Description and choose the Duration under Passwords.

     

2. Click Save. The client secret will be generated, and then copy and paste it into the text box.

   

3. Now Test the connection. If the connection is valid, the success message is displayed. Save the settings.

The Azure user can now be imported into the Syncfusion User Management Server. Refer the following link to Import Azure Active Directory Users and Import Azure Active Directory Groups

Login with Azure ADFS

Once the SSO settings are saved and the Azure users are imported to the Syncfusion User Management Server, logout from the application. The Login page now will have an additional button named Microsoft ADFS, which opens the external authentication provider login window.

Once you Sign In with the Azure username and password, you have logged in to the Syncfusion User Management Server.

NOTE

To login to the Syncfusion User Management Server with Azure ADFS, the particular user should be imported to the application. If the user is not imported, it redirects to the Login page.