How to authenticate Azure-hosted JavaScript apps to Azure resources using the Azure Identity library

When an app is hosted in Azure (using a service like Azure App Service, Azure Functions, or Azure Container Apps), you can use a managed identity to securely authenticate your app to Azure resources.

A managed identity provides an identity for your app, allowing it to connect to other Azure resources without needing to use a secret (such as a connection string or key). Internally, Azure recognizes the identity of your app and knows which resources the app is authorized to access. Azure uses this information to automatically obtain Microsoft Entra tokens for the app, enabling it to connect to other Azure resources without requiring you to manage (create or rotate) authentication secrets.

Managed identity types

There are two types of managed identities:

• System-assigned managed identities - single Azure resource
• User-assigned managed identities - multiple Azure resources

This article covers the steps to enable and use a system-assigned managed identity for an app. If you need to use a user-assigned managed identity, see the article Manage user-assigned managed identities to see how to create a user-assigned managed identity.

System-assigned managed identities for single resource

System-assigned managed identities are provided by and tied directly to an Azure resource. When you enable managed identity on an Azure resource, you get a system-assigned managed identity for that resource. The managed identity is tied to the lifecycle of the Azure resource. When the resource is deleted, Azure automatically deletes the identity for you. Since all you have to do is enable managed identity for the Azure resource hosting your code, this identity type is the easiest type of managed identity to use.

User-assigned managed identities for multiple resources

A user-assigned managed identity is a standalone Azure resource. This identity type is most frequently used when your solution has multiple workloads that run on multiple Azure resources that all need to share the same identity and same permissions. For example, suppose your solution includes applications that run on multiple App Service and virtual machine instances. The applications all need access to the same set of Azure resources. Creating and using a user-assigned managed identity across those resources is the best design choice.

1 - Enable system-assigned managed identity in hosted app

The first step is to enable managed identity on the Azure resource hosting your app. For example, if you're hosting an Express.js application using Azure App Service, you need to enable managed identity for that App Service web app. If you're using a VM to host your app, you enable your VM to use managed identity.

You can enable managed identity to be used for an Azure resource using either the Azure portal or the Azure CLI.

Azure portal

Instructions	Screenshot
Navigate to the resource that hosts your application code in the Azure portal. For example, you can type the name of your resource in the search box at the top of the page and navigate to it by selecting it in the dialog box.
On the page for your resource, select the Identity menu item from the left-hand menu. All Azure resources capable of supporting managed identity will have an Identity menu item even though the layout of the menu may vary slightly.
On the Identity page: Change the Status slider to On. Select Save. A confirmation dialog verifies you want to enable managed identity for your service. Answer Yes to enable managed identity for the Azure resource.

Azure CLI

Azure CLI commands can be run in the Azure Cloud Shell or on a workstation with the Azure CLI installed.

The Azure CLI commands used to enable managed identity for an Azure resource are of the form az <command-group> identity --resource-group <resource-group-name> --name <resource-name>. Specific commands for popular Azure services are provided here.

Azure App Service

Azure CLI

az webapp identity assign --resource-group <resource-group-name> -name <web-app-name>

Azure Virtual Machines

Azure CLI

az vm identity assign --resource-group <resource-group-name> -name <virtual-machine-name>

The output looks like the following.

JSON

{
  "principalId": "<REPLACE_WITH_YOUR_PRINCIPAL_ID>",
  "tenantId": "<REPLACE_WITH_YOUR_TENANT_ID>",
  "type": "SystemAssigned",
  "userAssignedIdentities": null
}

The principalId value is the unique ID of the managed identity. Keep a copy of this output as you'll need these values in the next step.

2 - Assign roles to the managed identity

Next, you need to determine what roles (permissions) your app needs and assign the managed identity to those roles in Azure. A managed identity can be assigned roles at a resource, resource group, or subscription scope. This example shows how to assign roles at the resource group scope since most applications group all their Azure resources into a single resource group.

Azure portal

Instructions	Screenshot
Locate the resource group for your application by searching for the resource group name using the search box at the top of the Azure portal. Navigate to your resource group by selecting the resource group name under the Resource Groups heading in the dialog box.
On the page for the resource group, select Access control (IAM) from the left-hand menu.
On the Access control (IAM) page: Select the Role assignments tab. Select + Add from the top menu and then Add role assignment from the resulting drop-down menu.
The Add role assignment page lists all of the roles that can be assigned for the resource group. Use the search box to filter the list to a more manageable size. This example shows how to filter for Storage Blob roles. Select the role that you want to assign. Select Next to go to the next screen.
The next Add role assignment page allows you to specify what user to assign the role to. Select Managed identity under Assign access to. Select + Select members under Members A dialog box opens on the right-hand side of the Azure portal.
In the Select managed identities dialog: The Managed identity dropdown and Select text box can be used to filter the list of managed identities in your subscription. In this example by selecting App Service, only managed identities associated with an App Service are displayed. Select the managed identity for the Azure resource hosting your application. Choose Select at the bottom of the dialog to continue.
The managed identity shows as selected on the Add role assignment screen. Select Review + assign to go to the final page and then Review + assign again to complete the process.

Azure CLI

A managed identity is assigned a role in Azure using the [az role assignment create] command.

Azure CLI

az role assignment create --assignee "{managedIdentityId}" \
    --role "{roleName}" \
    --resource-group "{resourceGroupName}"

To get the role names that a service principal can be assigned to, use the az role definition list command.

Azure CLI

az role definition list \
    --query "sort_by([].{roleName:roleName, description:description}, &roleName)" \
    --output table

For example, to allow the managed identity to read, write, and delete access to Azure Storage blob containers and data to all storage accounts in the msdocs-sdk-auth-example resource group, you would assign the application service principal to the Storage Blob Data Contributor role using the following command.

Azure CLI

az role assignment create --assignee aaaaaaaa-bbbb-cccc-7777-888888888888 \
    --role "Storage Blob Data Contributor" \
    --resource-group "msdocs-sdk-auth-example"

For information on assigning permissions at the resource or subscription level using the Azure CLI, see the article Assign Azure roles using the Azure CLI.

3 - Implement DefaultAzureCredential in your application

DefaultAzureCredential automatically detects that a managed identity is being used and uses the managed identity to authenticate to other Azure resources. As discussed in the Azure Identity library for JavaScript authentication overview article, DefaultAzureCredential supports multiple authentication methods and determines the authentication method being used at runtime. In this way, your app can use different authentication methods in different environments without implementing environment-specific code.

First, add the @azure/identity package to your application.

terminal

npm install @azure/identity

Next, for any JavaScript code that creates an Azure SDK client object in your app, you want to:

1. Import the DefaultAzureCredential class from the @azure/identity module.
2. Create a DefaultAzureCredential object.
3. Pass the DefaultAzureCredential object to the Azure SDK client object constructor.

An example of these steps is shown in the following code segment.

JavaScript

// connect-with-default-azure-credential.js
import { BlobServiceClient } from '@azure/storage-blob';
import { DefaultAzureCredential } from '@azure/identity';
import 'dotenv/config'

const accountName = process.env.AZURE_STORAGE_ACCOUNT_NAME;
if (!accountName) throw Error('Azure Storage accountName not found');

const blobServiceClient = new BlobServiceClient(
  `https://${accountName}.blob.core.windows.net`,
  new DefaultAzureCredential()
);