Autenticación de aplicaciones de JavaScript en servicios de Azure durante el desarrollo local mediante cuentas de desarrollador

Al crear aplicaciones en la nube, los desarrolladores deben depurar y probar aplicaciones en su estación de trabajo local. Cuando se ejecuta una aplicación en la estación de trabajo de un desarrollador durante el desarrollo local, esta debe autenticarse en los servicios de Azure que usa. En este artículo se explica cómo usar las credenciales de Azure de un desarrollador para autenticar la aplicación en Azure durante el desarrollo local.

Diagrama que muestra una aplicación de desarrollo local que ejecuta la obtención de una entidad de servicio de un archivo .env y usa esa identidad para conectarse a los recursos de Azure.

Para que una aplicación se autentique en Azure durante el desarrollo local mediante las credenciales de Azure del desarrollador, el desarrollador debe iniciar sesión en Azure desde la extensión Azure Tools de Visual Studio Code, la CLI de Azure o Azure PowerShell. El SDK de Azure para JavaScript puede detectar que el desarrollador ha iniciado sesión desde una de estas herramientas y, a continuación, obtener las credenciales necesarias de la memoria caché de credenciales para autenticar la aplicación en Azure como el usuario que ha iniciado sesión.

Este enfoque es más fácil de configurar para un equipo de desarrollo, ya que aprovecha las cuentas de Azure existentes de los desarrolladores. Sin embargo, es probable que la cuenta de un desarrollador tenga más permisos de los que requiere la aplicación, por lo que superará los permisos con los que se ejecuta la aplicación en producción. Como alternativa, puede crear entidades de servicio de aplicación para usarlas durante el desarrollo local, que se puede limitar a tener solo el acceso necesario para la aplicación.

1- Creación de un grupo de Microsoft Entra para el desarrollo local

Puesto que casi siempre hay varios desarrolladores que trabajan en una aplicación, se recomienda crear primero un grupo de Microsoft Entra para encapsular los roles (permisos) que la aplicación necesita en el desarrollo local. Esto ofrece las ventajas que se indican a continuación.

  • Todos los desarrolladores están seguros de tener asignados los mismos roles, ya que los roles se asignan en el nivel de grupo.
  • Si se necesita un nuevo rol para la aplicación, solo debe agregarse al grupo De Microsoft Entra para la aplicación.
  • Si un nuevo desarrollador se une al equipo, simplemente debe agregarse al grupo correcto de Microsoft Entra para obtener los permisos correctos para trabajar en la aplicación.

Si tiene un grupo de Microsoft Entra existente para el equipo de desarrollo, puede usar ese grupo. De lo contrario, complete los pasos siguientes para crear un grupo de Microsoft Entra.

Instrucciones Instantánea
Vaya a la página Microsoft Entra ID (Id. de Entra de Microsoft) en Azure Portal; para ello, escriba Microsoft Entra ID en el cuadro de búsqueda de la parte superior de la página y, a continuación, seleccione Microsoft Entra ID en los servicios. Captura de pantalla en la que se muestra cómo usar la barra de búsqueda superior de Azure Portal para buscar y navegar a la página De id. de Microsoft Entra.
En la página Microsoft Entra ID (Id. de Entra de Microsoft), seleccione Grupos en el menú de la izquierda. Captura de pantalla que muestra la ubicación del elemento de menú Grupos en el menú izquierdo de la página Directorio predeterminado de Id. de Microsoft Entra.
En la página Todos los grupos, seleccione Nuevo grupo. Captura de pantalla que muestra la ubicación del botón Nuevo grupo en la página Todos los grupos.
En la página Nuevo grupo:
  1. Tipo de grupo → Seguridad.
  2. Nombre de grupo → Nombre del grupo de seguridad, que normalmente se crea a partir del nombre de la aplicación. También resulta útil incluir una cadena como local-dev en el nombre del grupo para indicar el propósito del grupo.
  3. Descripción del grupo → Descripción del propósito del grupo.
  4. Seleccione el vínculo Sin miembros seleccionados en Miembros para agregar miembros al grupo.
Captura de pantalla que muestra cómo crear un nuevo grupo de Microsoft Entra. La ubicación del vínculo que se va a seleccionar para agregar miembros a este grupo está resaltado.
En el cuadro de diálogo Agregar miembros:
  1. Use el cuadro de búsqueda para filtrar la lista de nombres de usuario en la lista.
  2. Elija uno o varios usuarios para el desarrollo local para esta aplicación. Al elegir un objeto, el objeto se mueve a la lista Elementos seleccionados en la parte inferior del cuadro de diálogo.
  3. Cuando termine, elija el botón Seleccionar .
Captura de pantalla del cuadro de diálogo Agregar miembros que muestra cómo seleccionar las cuentas de desarrollador que se deben incluir en el grupo.
De nuevo en la página Nuevo grupo, seleccione Crear para crear el grupo.

El grupo se creará y volverá a la página Todos los grupos. El grupo puede tardar hasta 30 segundos en aparecer y es posible que tenga que actualizar la página debido al almacenamiento en caché en Azure Portal.
Captura de pantalla de la página Nuevo grupo que muestra cómo completar el proceso con la selección del botón Crear.

2- Asignar roles al grupo Microsoft Entra

A continuación, debe determinar qué roles (permisos) necesita la aplicación y en qué recursos y asignar dichos roles a la aplicación. En este ejemplo, los roles se asignan al grupo Microsoft Entra creado en el paso 1. Los roles se pueden asignar a un rol en el ámbito de recurso, grupo de recursos o suscripción. En este ejemplo se muestra cómo asignar roles en el ámbito del grupo de recursos, ya que la mayoría de las aplicaciones agrupan todos sus recursos de Azure en un único grupo de recursos.

Instrucciones Instantánea
Busque el grupo de recursos de la aplicación; para ello, busque el nombre del grupo de recursos mediante el cuadro de búsqueda situado en la parte superior de Azure Portal.

Vaya al grupo de recursos. Para ello, seleccione el nombre del grupo de recursos en el encabezado Grupos de recursos del cuadro de diálogo.
Captura de pantalla que muestra cómo usar el cuadro de búsqueda de la parte superior de Azure Portal para localizar el grupo de recursos al que desea asignar roles (permisos) y navegar hasta él.
En la página del grupo de recursos, seleccione Control de acceso (IAM) en el menú izquierdo. Captura de pantalla de la página del grupo de recursos que muestra la ubicación del elemento de menú de Control de acceso (IAM).
En la página Control de acceso (IAM):
  1. Seleccione la pestaña Asignaciones de roles.
  2. Seleccione + Agregar en el menú superior y, a continuación, Agregar asignación de roles en el menú desplegable resultante.
Captura de pantalla que muestra cómo navegar hasta la pestaña de asignación de roles junto con la ubicación del botón usado para agregar asignaciones de roles a un grupo de recursos.
La página Agregar asignación de roles muestra todos los roles que se pueden asignar para el grupo de recursos.
  1. Use el cuadro de búsqueda para filtrar la lista a un tamaño más fácil de administrar. En este ejemplo se muestra cómo filtrar los roles de Storage Blob.
  2. Seleccione el rol que quiere asignar.
    Seleccione Siguiente para ir a la pantalla siguiente.
Captura de pantalla que muestra cómo filtrar y seleccionar las asignaciones de roles que deben agregarse al grupo de recursos.
La siguiente página Agregar asignación de roles permite especificar a qué usuario se debe asignar el rol.
  1. Seleccione Usuario, grupo o entidad de servicio en Asignar acceso a.
  2. Seleccione + Seleccionar miembros en Miembros.
Se abre un cuadro de diálogo en el lado derecho de Azure Portal.
Captura de pantalla que muestra el botón de radio para seleccionar asignar un rol a un grupo de Microsoft Entra y el vínculo usado para seleccionar el grupo al que asignar el rol.
En el cuadro de diálogo Seleccionar miembros:
  1. El cuadro de texto Seleccionar se puede usar para filtrar la lista de usuarios y grupos de la suscripción. Si es necesario, escriba los primeros caracteres del grupo de Desarrollo local de Microsoft Entra que creó para la aplicación.
  2. Seleccione el grupo microsoft Entra de desarrollo local asociado a la aplicación.
Seleccione Seleccionar en la parte inferior del cuadro de diálogo para continuar.
Captura de pantalla que muestra cómo filtrar y seleccionar el grupo Microsoft Entra para la aplicación en el cuadro de diálogo Seleccionar miembros.
El grupo Microsoft Entra se muestra como seleccionado en la pantalla Agregar asignación de roles.

Seleccione Revisar y asignar para ir a la página final y, a continuación, Revisar y asignar de nuevo para completar el proceso.
Captura de pantalla que muestra la página Agregar asignación de roles completada y la ubicación del botón Revisar y asignar que se usa para completar el proceso.

3- Inicio de sesión en Azure mediante VS Code, la CLI de Azure o Azure PowerShell

Abra un terminal en la estación de trabajo del desarrollador e inicie sesión en Azure desde Azure PowerShell.

Connect-AzAccount

4: Implementación de DefaultAzureCredential en la aplicación

Para autenticar objetos de cliente del SDK de Azure en Azure, la aplicación debe usar la DefaultAzureCredential clase del @azure/identity paquete. En este escenario, DefaultAzureCredential comprobará secuencialmente si el desarrollador ha iniciado sesión en Azure mediante la extensión de herramientas de Azure de VS Code, la CLI de Azure o Azure PowerShell. Si el desarrollador ha iniciado sesión en Azure con cualquiera de estas herramientas, la aplicación usará las credenciales usadas para iniciar sesión en la herramienta para autenticarse en Azure.

Empiece agregando el paquete @azure/identity a la aplicación.

npm install @azure/identity

A continuación, para cualquier código javaScript que cree un objeto de cliente del SDK de Azure en la aplicación, querrá:

  1. Importe la DefaultAzureCredential clase desde el @azure/identity módulo.
  2. Crear un objeto DefaultAzureCredential.
  3. Pase el DefaultAzureCredential objeto al constructor de objetos de cliente del SDK de Azure.

En el segmento de código siguiente se muestra un ejemplo de esto.

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á automáticamente el mecanismo de autenticación configurado para la aplicación y obtendrá los tokens necesarios para autenticar la aplicación en Azure. Si una aplicación usa más de un cliente del SDK, se puede usar el mismo objeto de credencial con cada objeto cliente del SDK.