Authentification personnalisée dans Azure Static Web Apps

Azure Static Web Apps fournit une authentification managée qui utilise les inscriptions de fournisseur gérées par Azure. Pour bénéficier d’une plus grande souplesse au niveau de l’inscription, vous pouvez remplacer les valeurs par défaut par une inscription personnalisée.

  • L’authentification personnalisée vous permet également de configurer des fournisseurs personnalisés qui prennent en charge OpenID Connect. Cette configuration permet l’inscription de plusieurs fournisseurs externes.

  • L’utilisation de toute inscription personnalisée désactive tous les fournisseurs préconfigurés.

Remarque

L’authentification personnalisée est uniquement disponible dans le plan Standard d’Azure Static Web Apps.

Configurer un fournisseur d’identité personnalisé

Les fournisseurs d’identité personnalisés sont configurés dans la section auth du fichier config.

Pour éviter de placer des secrets dans le contrôle de code source, la configuration recherche dans les paramètres d’application un nom correspondant dans le fichier config. Vous pouvez également choisir de stocker vos secrets dans Azure Key Vault.

Pour créer l’inscription, commencez par créer les paramètres d’application suivants :

Nom du paramètre Valeur
AZURE_CLIENT_ID ID d’application (client) pour l’inscription de l’application Microsoft Entra.
AZURE_CLIENT_SECRET Clé secrète client pour l’inscription de l’application Microsoft Entra.

Ensuite, utilisez l’exemple suivant pour configurer le fournisseur dans le fichier config.

Les fournisseurs Microsoft Entra sont disponibles dans deux versions différentes. La version 1 définit explicitement le userDetailsClaim, qui permet à la charge utile de retourner des informations utilisateur. Inversement, la version 2 renvoie des informations utilisateur par défaut, et est désignée par v2.0 dans l’URL openIdIssuer.

Microsoft Entra Version 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"
        }
      }
    }
  }
}

Veillez à remplacer <TENANT_ID> par votre ID de locataire Microsoft Entra.

Microsoft Entra Version 2

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

Veillez à remplacer <TENANT_ID> par votre ID de locataire Microsoft Entra.

Pour plus d’informations sur la configuration de l’ID Microsoft Entra, consultez la documentation d’authentification/autorisation App Service sur l’utilisation d’une inscription existante.

Pour configurer les comptes qui peuvent se connecter, consultez Modifier les comptes pris en charge par une application et restreindre votre application Microsoft Entra à un ensemble d’utilisateurs d’un locataire Microsoft Entra.

Remarque

Bien que la section de configuration de l’ID Microsoft Entra soit azureActiveDirectory, la plateforme alias ceci aad dans l’URL pour la connexion, la déconnexion et la purge des informations utilisateur. Consultez la section authentification et autorisation pour plus d’informations.

Rappels d’authentification

Les fournisseurs d’identité ont besoin d’une URL de redirection pour terminer la requête de connexion ou de déconnexion. La plupart des fournisseurs exigent que vous ajoutiez les URL de rappel à une liste d’autorisation. Les points de terminaison suivants sont disponibles comme destinations de redirection.

Type Modèle d’URL
Connexion https://<YOUR_SITE>/.auth/login/<PROVIDER_NAME_IN_CONFIG>/callback
Logout https://<YOUR_SITE>/.auth/logout/<PROVIDER_NAME_IN_CONFIG>/callback

Si vous utilisez l’ID Microsoft Entra, utilisez aad la valeur de l’espace <PROVIDER_NAME_IN_CONFIG> réservé.

Remarque

Ces URL sont fournies par Azure Static Web Apps pour recevoir la réponse du fournisseur d’authentification ; vous n’avez pas besoin de créer des pages sur ces itinéraires.

Informations de connexion, de déconnexion et de l’utilisateur

Pour utiliser un fournisseur d’identité personnalisé, utilisez les modèles d’URL suivants.

Action Modèle
Connexion /.auth/login/<PROVIDER_NAME_IN_CONFIG>
Logout /.auth/logout
Détails sur l’utilisateur /.auth/me
Suppression définitive des détails de l’utilisateur /.auth/purge/<PROVIDER_NAME_IN_CONFIG>

Si vous utilisez l’ID Microsoft Entra, utilisez aad la valeur de l’espace <PROVIDER_NAME_IN_CONFIG> réservé.

Gérer les rôles

Tous les utilisateurs qui accèdent à une application web statique appartiennent à un ou plusieurs rôles. Les utilisateurs peuvent appartenir à deux rôles intégrés :

  • anonyme : tous les utilisateurs appartiennent automatiquement au rôle anonyme .
  • authentifié : tous les utilisateurs qui sont connectés appartiennent au rôle authentifié.

Outre les rôles intégrés, vous pouvez attribuer des rôles personnalisés aux utilisateurs et les référencer dans le fichier staticwebapp.config.json.

Ajouter un utilisateur à un rôle

Pour ajouter un utilisateur à un rôle, il faut générer des invitations permettant d’associer des utilisateurs à des rôles spécifiques. Les rôles sont définis et gérés dans le fichier staticwebapp.config.json.

Créer une invitation

Les invitations sont spécifiques à chaque fournisseur d’autorisation. Tenez compte des besoins de votre application lorsque vous sélectionnez les fournisseurs à utiliser. Certains fournisseurs exposent l’adresse e-mail de l’utilisateur, tandis que d’autres fournissent uniquement le nom d’utilisateur sur le site.

Fournisseur d’autorisation Expose
Microsoft Entra ID de l’adresse de messagerie
GitHub username
Twitter username

Procédez comme suit pour créer une invitation.

  1. Accédez à la ressource Static Web Apps sur le portail Azure.
  2. Sous Paramètres, sélectionnez Gestion des rôles
  3. Sélectionnez Inviter.
  4. Sélectionnez un fournisseur d’autorisation dans la liste des options.
  5. Ajoutez le nom d’utilisateur ou l’adresse e-mail du destinataire dans la zone Détails sur l’invité.
    • Pour GitHub et Twitter, entrez le nom d’utilisateur. Pour tous les autres, entrez l’adresse e-mail du destinataire.
  6. Sélectionnez le domaine de votre site statique dans le menu déroulant Domaine.
    • Le domaine que vous sélectionnez est le domaine qui apparaît dans l’invitation. Si un domaine personnalisé est associé à votre site, choisissez-le.
  7. Ajoutez une liste séparée par des virgules de noms de rôles dans la zone Rôle.
  8. Entrez le nombre d’heures pendant lesquelles vous souhaitez que l’invitation reste valide.
    • La limite maximale est de 168 heures, soit 7 jours.
  9. Sélectionnez Générer.
  10. Copiez le lien dans la zone Lien d’invitation.
  11. Envoyez par e-mail le lien d’invitation à l’utilisateur auquel vous accordez l’accès.

Quand l’utilisateur sélectionne le lien dans l’invitation, il est invité à se connecter avec son compte correspondant. Une fois que l’utilisateur est connecté, il est associé aux rôles sélectionnés.

Attention

Vérifiez que vos règles d’acheminement ne sont pas en conflit avec les fournisseurs d’authentification sélectionnés. Le blocage d’un fournisseur avec une règle d’acheminement empêche les utilisateurs d’accepter des invitations.

Mettre à jour les attributions de rôles

  1. Accédez à la ressource Static Web Apps sur le portail Azure.
  2. Sous Paramètres, sélectionnez Gestion des rôles
  3. Sélectionnez l’utilisateur dans la liste.
  4. Modifiez la liste des rôles dans la zone Rôle.
  5. Sélectionnez Mettre à jour.

Supprimer l’utilisateur

  1. Accédez à la ressource Static Web Apps sur le portail Azure.
  2. Sous Paramètres, sélectionnez Gestion des rôles
  3. Recherchez l’utilisateur dans la liste.
  4. Activez la case à cocher sur la ligne de l’utilisateur.
  5. Sélectionnez Supprimer.

Lorsque vous supprimez un utilisateur, vous devez garder à l’esprit les considérations suivantes :

  • La suppression d’un utilisateur invalide ses autorisations.
  • La propagation globale peut prendre quelques minutes.
  • Si l’utilisateur est de nouveau ajouté à l’application, le userId change.

Étapes suivantes