To enable your users to login with Microsoft, you must enable Microsoft login in the builder and then create an application with Microsoft to serve as the OAuth provider.

Read below to learn how.

Enable In Builder

Go to Home and click on the Login Box builder.

In the left panel, toggle the switch to on for Microsoft.

🚧

When making changes to the settings in the builder, be sure to commit your changes and then publish for them to take effect and to configure them in your environments.

Create Microsoft App

Follow the steps to below to configure Microsoft login.

👍

Moving Environments

When moving a project from one environment to another, Frontegg moves the social login environment configurations for you. For instance, if moving from development to production, Frontegg moves the development social login configurations to production.

Step 1: Open Project

To create your OAuth application, go to Microsoft Azure and select Manage Azure Active Directory.

Step 2: Register Your Application

Click on App registrations and then New Registration.

Then, do the following:

• Set your application name.
• Select your Supported account types.
• Set your Redirect URI (for example, http://localhost:3000/account/social/success).
  
  

📘

Supported Account Types

Choose the option Accounts in any organizational directory (Any Azure AD directory - Multitenant) and personal Microsoft accounts (e.g. Skype, Xbox)

Step 3: Get ClientId and Client Secret

Your Microsoft ClientId is located on your Microsoft app's Overview page. Look for Application (client) ID.

To create a client secret, open Certificates & secrets and click on New client secret.

Set an expiration time and description for you client secret.

Copy and save the Value for your client secret. You will not be able to see it again in your Microsoft account.

Step 4: Enter Credentials In Frontegg

Go to Environments ➜ [NAME OF ENVIRONMENT] ➜ Authentication ➜ Social Logins.

Click on the Microsoft manage button.

Enter your Microsoft Client ID, Client Secret, and Redirect URL. Then save and publish.

Step 5: Test Microsoft Button

In your login screen, you should see a Microsoft button that redirects to the Microsoft OAuth Consent screen for login. Test it to make sure it works.

📘

Set Who Can Login With Microsoft

By default, only invited users can login with Microsoft. If you want to allow new users to signup with Microsoft, go to the Login Box builder and enable Allow Signups in the left panel.

Customizing Authentication Scopes for Microsoft

Scopes let you specify exactly what type of information your application can fetch from your users after they grant it access— and the generated access token includes these approved scopes. Frontegg currently fetches a user profile and user email as default scopes when users authenticate via their Microsoft account. You can add additional, custom scopes to your social login via your Frontegg portal. To do so, go to [Environment name] > Authentication > Social login > Custom > Scopes. You can check Microsoft's supported scopes here.