Autenticar aplicativos JavaScript nos serviços do Azure durante o desenvolvimento local usando contas de desenvolvedor

Quando você cria aplicativos em nuvem, os desenvolvedores precisam depurar e testar aplicativos em sua estação de trabalho local. Quando um aplicativo é executado na estação de trabalho de um desenvolvedor durante o desenvolvimento local, deve ser feita a autenticação em todos os serviços do Azure usados pelo aplicativo. Este artigo trata de como usar as credenciais do Azure de um desenvolvedor para autenticar o aplicativo no Azure durante o desenvolvimento local.

Para que um aplicativo se autentique no Azure durante o desenvolvimento local usando as credenciais do Azure do desenvolvedor, o desenvolvedor deve estar conectado ao Azure da extensão Ferramentas do Azure do Visual Studio Code, da CLI do Azure ou do Azure PowerShell. O SDK do Azure para JavaScript é capaz de detectar que o desenvolvedor está conectado de uma dessas ferramentas e, em seguida, obter as credenciais necessárias do cache de credenciais para autenticar o aplicativo no Azure como o usuário conectado.

Essa abordagem é mais fácil de configurar para uma equipe de desenvolvimento, pois aproveita as contas existentes do Azure dos desenvolvedores. No entanto, a conta de um desenvolvedor provavelmente terá mais permissões do que as exigidas pelo aplicativo, excedendo, portanto, as permissões com as quais o aplicativo é executado na produção. Como alternativa, você pode criar entidades de serviço de aplicativo para usar durante o desenvolvimento local, que podem ter o escopo para terem apenas o acesso necessário pelo aplicativo.

1 – Criar um grupo do Microsoft Entra para desenvolvimento local

Como quase sempre há vários desenvolvedores que trabalham em um aplicativo, é recomendável primeiro criar um grupo do Microsoft Entra para encapsular as funções (permissões) que o aplicativo precisa no desenvolvimento local. As vantagens disso são as seguintes.

• Cada desenvolvedor deve ter as mesmas funções atribuídas, já que as funções são atribuídas no nível do grupo.
• Se uma nova função for necessária para o aplicativo, ela só precisará ser adicionada ao grupo do Microsoft Entra para o aplicativo.
• Se um novo desenvolvedor ingressar na equipe, ele simplesmente deverá ser adicionado ao grupo correto do Microsoft Entra para obter as permissões corretas para trabalhar no aplicativo.

Se você tiver um grupo existente do Microsoft Entra para sua equipe de desenvolvimento, poderá usar esse grupo. Caso contrário, conclua as etapas a seguir para criar um grupo do Microsoft Entra.

Portal do Azure

Instruções	Captura de tela
Navegue até a página ID do Microsoft Entra no portal do Azure digitando ID do Microsoft Entra na caixa de pesquisa na parte superior da página e selecionando ID do Microsoft Entra em serviços.
Na página Microsoft Entra ID, selecione Grupos no menu à esquerda.
Na página Todos os grupos, selecione Novo grupo.
Na página Novo grupo: Tipo de grupo → Segurança. Nome do grupo → Um nome para o grupo de segurança, normalmente criado com base no nome do aplicativo. Também é útil incluir uma cadeia de caracteres como desenvolvimento local no nome do grupo para indicar a finalidade do grupo. Descrição do grupo → Uma descrição da finalidade do grupo. Selecione o link Nenhum membro selecionado em Membros para adicionar membros ao grupo.
Na caixa de diálogo Adicionar membros: Use a caixa de pesquisa para filtrar a lista de nomes de usuário. Escolha um ou mais usuários para desenvolvimento local para esse aplicativo. À medida que você escolhe um objeto, o objeto se move para a lista Itens selecionados na parte inferior da caixa de diálogo. Quando terminar, escolha o botão Selecionar.
De volta à página Novo grupo, selecione Criar para criar o grupo. O grupo será criado e você retorna para a página Todos os grupos. Pode levar até 30 segundos para que o grupo apareça e talvez seja necessário atualizar a página devido ao cache no portal do Azure.

CLI do Azure

O comando az ad group create é usado para criar grupos no Microsoft Entra ID. Os parâmetros --display-name e --main-nickname são obrigatórios. O nome fornecido ao grupo deve ter como base o nome do aplicativo. Também é interessante incluir uma frase como “desenvolvimento local” no nome do grupo para indicar a finalidade do grupo.

az ad group create \
    --display-name MyDisplay \
    --mail-nickname MyDisplay  \
    --description <group-description>

Para adicionar membros ao grupo, você precisa do ID de objeto do usuário do Azure. Use a lista de usuários do az ad para listar as entidades de serviço disponíveis. O comando de parâmetro --filter aceita filtros de estilo OData e pode ser usado para filtrar a lista no nome de exibição do usuário, conforme mostrado. O --query parâmetro retorna colunas especificadas.

az ad user list \
    --filter "startswith(displayName, 'Bob')" \
    --query "[].{objectId:objectId, displayName:displayName}" \
    --output table

O comando az ad group member add pode ser usado para adicionar membros a grupos.

az ad group member add \
    --group <group-name> \
    --member-id <object-id>

2 – Atribuir funções ao grupo Microsoft Entra

Em seguida, você precisa determinar as funções (permissões) de que seu aplicativo precisa em quais recursos e atribuir essas funções ao seu aplicativo. Nesse exemplo, as funções são atribuídas ao grupo do Microsoft Entra criado na etapa 1. As funções podem ser atribuídas a uma função em um recurso, grupo de recursos ou escopo de assinatura. Este exemplo mostra como atribuir funções no escopo do grupo de recursos, uma vez que a maioria dos aplicativos agrupa todos os seus recursos do Azure em um único grupo de recursos.

Portal do Azure

Instruções	Captura de tela
Localize o grupo de recursos do aplicativo pesquisando pelo nome do grupo de recursos e usando a caixa de pesquisa na parte superior do portal do Azure. Navegue até o grupo de recursos selecionando o nome do grupo de recursos no título Grupos de recursos na caixa de diálogo.
Na página do grupo de recursos, selecione Controle de acesso (IAM) no menu à esquerda.
Na página Controle de acesso (IAM): Selecione a guia Atribuições de função. Selecione + Adicionar no menu superior e, em seguida, Adicionar atribuição de função no menu suspenso resultante.
A página Adicionar atribuição de função lista todas as funções que podem ser atribuídas ao grupo de recursos. Use a caixa de pesquisa para filtrar a lista para obter um tamanho mais gerenciável. Este exemplo mostra como filtrar as funções do Blob de Armazenamento. Selecione a função que você deseja atribuir. Selecione Avançar para ir para a próxima tela.
A próxima página Adicionar atribuição de função permite especificar a qual usuário atribuir a função. Selecione Usuário, grupo ou entidade de serviço em Atribuir acesso a. Selecionar + Selecionar membros em Membros Uma caixa de diálogo é aberta no lado direito do portal do Azure.
Na caixa de diálogo Selecionar membros: A caixa de texto Selecionar pode ser usada para filtrar a lista de usuários e grupos em sua assinatura. Se necessário, digite os primeiros caracteres do grupo de desenvolvimento local do Microsoft Entra que você criou para o aplicativo. Selecione o grupo de desenvolvimento local do Microsoft Entra associado ao seu aplicativo. Para continuar, selecione Selecionar na parte inferior da caixa de diálogo.
O grupo Microsoft Entra é exibido como selecionado na tela Adicionar atribuição da função. Selecione Revisar + atribuir para ir para a página final e, em seguida, Revisar + atribuir novamente para concluir o processo.

CLI do Azure

Uma entidade de serviço de aplicativo recebe uma função no Azure usando o comando az role assignment create.

az role assignment create --assignee "{appId}" \
    --scope /subscriptions/"{subscriptionName}" \
    --role "{roleName}" \
    --resource-group "{resourceGroupName}"

Para obter os nomes de função aos quais uma entidade de serviço pode ser atribuída, use o comando az role definition list.

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

Por exemplo, para permitir que a entidade de serviço de aplicativo leia, grave e exclua o acesso a contêineres de blobs e dados do Armazenamento do Azure para todas as contas de armazenamento no grupo de recursos msdocs-sdk-auth-example, você atribuiria a entidade de serviço de aplicativo à função Colaborador de Dados do Blob de Armazenamento usando o comando a seguir.

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

Para obter informações sobre como atribuir permissões no nível de recurso ou assinatura usando a CLI do Azure, consulte o artigo Atribuir funções do Azure usando a CLI do Azure.

3 – Entrar no Azure usando o VS Code, a CLI do Azure ou o Azure PowerShell

PowerShell do Azure

Abra um terminal na estação de trabalho do desenvolvedor e entre no Azure com o Azure PowerShell.

Connect-AzAccount

4 – Implementar DefaultAzureCredential no seu aplicativo

Para autenticar objetos clientes do SDK do Azure no Azure, seu aplicativo deve usar a classe DefaultAzureCredential do pacote @azure/identity. Nesse cenário, DefaultAzureCredential verificará sequencialmente se o desenvolvedor entrou no Azure usando a extensão de ferramentas do Azure do VS Code, a CLI do Azure ou o Azure PowerShell. Se o desenvolvedor estiver conectado ao Azure usando qualquer uma dessas ferramentas, as credenciais usadas para entrar na ferramenta serão usadas pelo aplicativo para autenticar no Azure.

Comece adicionando o pacote @azure/identidade ao seu aplicativo.

npm install @azure/identity

Em seguida, para qualquer código JavaScript que crie um objeto cliente do SDK do Azure em seu aplicativo, você deverá:

1. Importar a classe DefaultAzureCredential do módulo @azure/identity.
2. Crie um objeto DefaultAzureCredential.
3. Passar o objeto DefaultAzureCredential para o construtor do objeto do cliente do SDK do Azure.

Um exemplo disso é mostrado na ilustração a seguir.

import { BlobServiceClient } from '@azure/storage-blob';
import { DefaultAzureCredential } from '@azure/identity';

// Acquire a credential object
const tokenCredential = DefaultAzureCredential();

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

DefaultAzureCredential detectará automaticamente o mecanismo de autenticação configurado para o aplicativo e obterá os tokens necessários para autenticar o aplicativo no Azure. Se um aplicativo usar mais de um cliente SDK, o mesmo objeto de credencial poderá ser usado com cada objeto cliente SDK.