# Microsoft Entra ID Configuration for Single-Page Applications

{% hint style="warning" %}
Azure Active Directory (Azure AD) has been renamed **Microsoft Entra ID** (**ME-ID**). While the WorkflowGen documentation has been updated to reflect this name change, the WorkflowGen application settings still refer to Azure AD (for example, `Azure AD SCIM v2` directory connector). 

Likewise, certain ME-ID configuration items in the Azure portal have been renamed and/or moved. The WorkflowGen documentation has been updated accordingly, but still might not be completely accurate in this regard. See the [Microsoft Entra ID](https://learn.microsoft.com/en-us/entra/identity/) documentation for more information.
{% endhint %}

## Overview

This section provides instructions on how to configure Microsoft Entra ID (ME-ID) with a single-page application (SPA) so that users can authenticate through it and make requests to the WorkflowGen GraphQL API. This configuration is done in three steps: registering your SPA, granting access to the API, and setting some redirect URLs.

## Prerequisites

* Make sure to have a licensed copy of WorkflowGen installed and running on an IIS web server in **HTTPS** secure connection mode.
* Make sure to have administrative access to ME-ID to be able to configure it properly.
* Make sure to have provisioned an existing ME-ID user with which you can authenticate to WorkflowGen so that you can use the application afterwards.
* Make sure to have successfully configured delegated authentication to ME-ID on your WorkflowGen instance following the instructions in the [Microsoft Entra ID Authentication](https://docs.workflowgen.com/azure/azure-active-directory-authentication) section with the `WorkflowGen GraphQL API` application registered as well.

## Microsoft Entra ID configuration

### Step 1: Register a new web application

1. In the Azure portal, click **App registrations** in the **Azure services** section.
2. Click **New registration**, and fill in the properties:
   * **Name:** `My SPA name` 
   * **Supported account type:** `Accounts in this organizational directory only (Default Directory only - Single tenant)` \
     ✏️ **Note:** Depending on the context, you should choose the right option for your use case for the supported account type.
   * **Redirect URI:**
     * **Platform:** `Web` 
     * **Value:** `https://<my spa login url>`
3. Click **Register** at the bottom of the page.

You've now successfully registered your application in ME-ID.

### **Step 2: Authorize the implicit grant flow on the SPA application registration**

1. Click **Authentication**.
2. Go to the **Implicit grant and hybrid flows** section.
3. Check the **Access tokens** and **ID tokens** checkboxes.
4. Click **Save**.

### **Step 3: Grant access to WorkflowGen GraphQL API**

Now that you've successfully registered your SPA, you need to grant it access to the `WorkflowGen GraphQL API` application, which should be already registered if you've met the prerequisites.<br>

1. Click **API permissions**.
2. In the **Configured permissions** section, click **Add a permission**.
3. Click **My APIs**, then select the `WorkflowGen GraphQL API` application in the list.
4. Click **Delegated permissions** and check `default` under the **Permission** column.
5. Click **Add permissions**.
6. On the **API permissions** page, click **Grant admin consent for \<your tenant name>**, then click **Yes**.

{% hint style="success" %}
You should now see `WorkflowGen GraphQL API` in the list of your registered SPA's API permissions. Therefore, when requesting an access token to Azure, based on the audience, you should be able to obtain a correct token that you will send to your WorkflowGen instance's GraphQL API in addition to the request.
{% endhint %}

{% hint style="info" %}
For more information about the Azure **OAuth 2.0 Implicit grant flow** and additional examples, refer to the [Microsoft identity platform and implicit grant flow](https://docs.microsoft.com/en-us/azure/active-directory/develop/v2-oauth2-implicit-grant-flow) guide.
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.workflowgen.com/azure/azure-active-directory-configuration-for-single-page-applications.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.