Compartir vía


Autenticación personalizada en Azure Static Web Apps

Azure Static Web Apps proporciona autenticación administrada que usa registros de proveedor administrados por Azure. Para habilitar más flexibilidad sobre el registro, puede reemplazar los valores predeterminados por un registro personalizado.

  • La autenticación personalizada también le permite configurar proveedores personalizados que admitan OpenID Connect. Esta configuración permite el registro de varios proveedores externos.

  • El uso de registros personalizados deshabilita todos los proveedores preconfigurados.

Nota:

La autenticación personalizada solo está disponible en el plan Estándar de Azure Static Web Apps.

Configuración de un proveedor de identidades personalizados

Los proveedores de identidad personalizados se configuran en la sección auth del archivo de configuración.

Para evitar colocar secretos en el control de código fuente, la configuración busca en la configuración de la aplicación un nombre coincidente en el archivo de configuración. También puede optar por almacenar los secretos en Azure Key Vault.

Para crear el registro, empiece por crear la siguiente configuración de la aplicación:

Nombre de la opción de configuración Valor
AZURE_CLIENT_ID Id. de aplicación (cliente) para el registro de aplicaciones de Microsoft Entra.
`AZURE_CLIENT_SECRET_APP_SETTING_NAME Nombre de la configuración de la aplicación que contiene el secreto de cliente para el registro de aplicaciones de Microsoft Entra.

Use el ejemplo siguiente para configurar el proveedor en el archivo de configuración.

Los proveedores de Microsoft Entra están disponibles en dos versiones diferentes. La versión 1 define explícitamente userDetailsClaim, que permite que la carga devuelva información del usuario. Por el contrario, la versión 2 devuelve información del usuario de forma predeterminada y la designa con v2.0 en la dirección URL openIdIssuer.

Microsoft Entra versión 1

{
  "auth": {
    "identityProviders": {
      "azureActiveDirectory": {
        "userDetailsClaim": "http://schemas.xmlsoap.org/ws/2005/05/identity/claims/name",
        "registration": {
          "openIdIssuer": "https://login.microsoftonline.com/<TENANT_ID>",
          "clientIdSettingName": "AZURE_CLIENT_ID",
          "clientSecretSettingName": "AZURE_CLIENT_SECRET_APP_SETTING_NAME"
        }
      }
    }
  }
}

Asegúrese de reemplazar <TENANT_ID> por el id. de inquilino de Microsoft Entra.

Microsoft Entra versión 2

{
  "auth": {
    "identityProviders": {
      "azureActiveDirectory": {
        "registration": {
          "openIdIssuer": "https://login.microsoftonline.com/<TENANT_ID>/v2.0",
          "clientIdSettingName": "AZURE_CLIENT_ID",
          "clientSecretSettingName": "AZURE_CLIENT_SECRET_APP_SETTING_NAME"
        }
      }
    }
  }
}

Asegúrese de reemplazar <TENANT_ID> por el id. de inquilino de Microsoft Entra.

Para más información sobre cómo configurar Microsoft Entra ID, consulte la documentación sobre autenticación y autorización de App Service relacionada con el uso de un registro existente.

Para configurar qué cuentas pueden iniciar sesión, consulte Modificación de las cuentas compatibles con una aplicación y Restricción de la aplicación de Microsoft Entra a un conjunto de usuarios de un inquilino de Microsoft Entra.

Nota:

Aunque la sección de configuración de Microsoft Entra ID es azureActiveDirectory, la plataforma lo asocia a aad en las direcciones URL para iniciar sesión, cerrar sesión y purgar información del usuario. Consulte la sección de autenticación y autorización para obtener más información.

Certificado personalizado

Siga estos pasos para agregar un certificado personalizado al registro de la aplicación Microsoft Entra ID.

  1. Si el certificado aún no está cargado, cárguelo en un almacén de claves de Microsoft.

  2. Agregue una identidad administrada en la aplicación web estática.

    En el caso de las identidades administradas asignadas por el usuario, establezca la propiedad keyVaultReferenceIdentity en el objeto de sitio estático al resourceId de la identidad administrada asignada por el usuario.

    Omita este paso si la identidad administrada está asignada por el sistema.

  3. Conceda a la identidad administrada las siguientes directivas de acceso:

    • Secretos: Get/List
    • Certificados: Get/List
  4. Actualice la sección de configuración de autenticación de la sección de configuración azureActiveDirectory con un valor clientSecretCertificateKeyVaultReference como se muestra en el ejemplo siguiente:

    {
      "auth": {
        "rolesSource": "/api/GetRoles",
        "identityProviders": {
          "azureActiveDirectory": {
            "userDetailsClaim": "http://schemas.xmlsoap.org/ws/2005/05/identity/claims/emailaddress",
            "registration": {
              "openIdIssuer": "https://login.microsoftonline.com/common/v2.0",
              "clientIdSettingName": "AZURE_CLIENT_ID",
              "clientSecretCertificateKeyVaultReference": "@Microsoft.KeyVault(SecretUri=https://<KEY_VAULT_NAME>.azure.net/certificates/<CERTIFICATE_NAME>/<CERTIFICATE_VERSION_ID>)",
              "clientSecretCertificateThumbprint": "*"
            }
          }
        }
      }
    }
    

    Asegúrese de reemplazar los valores para los marcadores de posición rodeados por <>.

    En el identificador URI del secreto, especifique el nombre del almacén de claves y el nombre del certificado. Si desea anclar a una versión, incluya la versión del certificado; de lo contrario, omita la versión para permitir que el entorno de ejecución seleccione la versión más reciente del certificado.

    Establezca clientSecretCertificateThumbprint igual a * para extraer siempre la versión más reciente de la huella digital de los certificados.

Devoluciones de llamada de autenticación

Los proveedores de identidad personalizados requieren una dirección URL de redireccionamiento para completar la solicitud de inicio o cierre de sesión. La mayoría de los proveedores requieren que agregue las direcciones URL de devolución de llamada a una lista de permitidos. Los siguientes puntos de conexión están disponibles como destinos de redirección.

Tipo Patrón de URL
Iniciar sesión https://<YOUR_SITE>/.auth/login/<PROVIDER_NAME_IN_CONFIG>/callback
Logout https://<YOUR_SITE>/.auth/logout/<PROVIDER_NAME_IN_CONFIG>/callback

Si usa Microsoft Entra ID, use aad como valor para el marcador de posición <PROVIDER_NAME_IN_CONFIG>.

Nota:

Estas direcciones URL las proporciona Azure Static Web Apps para recibir la respuesta del proveedor de autenticación, no es necesario que cree páginas en estas rutas.

Inicio de sesión, cierre de sesión y detalles del usuario

Para usar un proveedor de identidad personalizado, use los siguientes patrones de dirección URL.

Action Patrón
Iniciar sesión /.auth/login/<PROVIDER_NAME_IN_CONFIG>
Logout /.auth/logout
Detalles de usuario /.auth/me
Purga de los detalles del usuario /.auth/purge/<PROVIDER_NAME_IN_CONFIG>

Si usa Microsoft Entra ID, use aad como valor para el marcador de posición <PROVIDER_NAME_IN_CONFIG>.

Administrar roles

Cada usuario que tiene acceso a una aplicación web estática pertenece a uno o varios roles. Existen dos roles integrados a los que los usuarios pueden pertenecer:

  • anónimo: todos los usuarios pertenecen automáticamente al rol anónimo.
  • autenticado: todos los usuarios que inician sesión pertenecen al rol autenticado.

Además de los roles integrados, puede crear asignar roles personalizados a los usuarios y hacer referencia a ellos en el archivo staticwebapp.config.json.

Adición de un usuario a un rol

Para agregar un usuario a un rol, genere invitaciones que le permitan asociar usuarios a roles concretos. Los roles se definen y mantienen en el archivo staticwebapp.config.json.

Crear una invitación

Las invitaciones son específicas de los proveedores de autorización individuales; por lo tanto, tenga en cuenta las necesidades de la aplicación al seleccionar los proveedores que se van a admitir. Algunos proveedores exponen la dirección de correo electrónico de los usuarios, mientras que otros solo proporcionan el nombre de usuario del sitio.

Proveedor de autorización Expone
Microsoft Entra ID Dirección de correo electrónico
GitHub username
X username

Use estos pasos para crear una invitación.

  1. Vaya a un recurso de Static Web Apps en Azure Portal.
  2. En Configuración, seleccione Administración de roles.
  3. Seleccione Invitar.
  4. Seleccione un Proveedor de autorización de la lista de opciones.
  5. Agregue el nombre de usuario o la dirección de correo electrónico del destinatario en el cuadro Invitee details (Detalles del invitado).
    • En GitHub y X, escriba el nombre de usuario. Para todos los demás, escriba la dirección de correo electrónico del destinatario.
  6. Seleccione el dominio del sitio estático del menú desplegable Dominio.
    • El dominio que seleccione será el dominio que aparezca en la invitación. Si tiene un dominio personalizado asociado a su sitio, elíjalo.
  7. Agregue una lista separada por comas de nombres de rol en el cuadro Rol.
  8. Especifique el número máximo de horas que desea que la invitación siga siendo válida.
    • El límite máximo posible es 168 horas, es decir, siete días.
  9. Seleccione Generar.
  10. Copie el vínculo del cuadro Vínculo de invitación.
  11. Envíe el vínculo de invitación por correo electrónico al usuario al que va a conceder acceso.

Cuando el usuario seleccione el vínculo de la invitación, se le solicitará que inicie sesión con su cuenta correspondiente. Con la sesión iniciada correctamente, los roles seleccionados se asocian al usuario.

Precaución

Asegúrese de que las reglas de ruta no entren en conflicto con los proveedores de autenticación seleccionados. Bloquear un proveedor con una regla de ruta impide a los usuarios aceptar invitaciones.

Actualización de las asignaciones de roles

  1. Vaya a un recurso de Static Web Apps en Azure Portal.
  2. En Configuración, seleccione Administración de roles.
  3. Seleccione el usuario en la lista.
  4. Edite la lista de roles en el cuadro Rol.
  5. Seleccione Actualizar.

Quitar usuario

  1. Vaya a un recurso de Static Web Apps en Azure Portal.
  2. En Configuración, seleccione Administración de roles.
  3. Busque el usuario en la lista.
  4. Active la casilla en la fila del usuario.
  5. Seleccione Eliminar.

Al quitar un usuario, tenga en cuenta los elementos siguientes:

  • Al quitar un usuario, se invalidan sus permisos.
  • La propagación mundial puede tardar unos minutos.
  • Si se vuelve a agregar el usuario a la aplicación, userId cambia.

Pasos siguientes