Partager via

Tutoriel : Connecter des utilisateurs à une application web Python Flask à l’aide de la plateforme d’identités Microsoft

S’applique à : cercle vert avec un symbole de coche blanc qui indique que le contenu suivant s’applique aux locataires du personnel. Cercle vert des locataires de main-d’œuvre avec un symbole de coche blanche qui indique que le contenu suivant s’applique aux locataires externes. Locataires externes (en savoir plus)

Ce tutoriel vous guide sur la sécurisation d’une application web Python Flask.

Dans ce tutoriel, vous allez :

  • Créer un projet Python Flask
  • Installer les dépendances requises
  • Configurer votre application web Flask pour utiliser la plateforme d’identités Microsoft pour l’authentification
  • Tester l’expérience de connexion et de déconnexion dans votre application web Flask

Conditions préalables

  • Un locataire d’employés. Vous pouvez utiliser votre répertoire par défaut ou configurer un nouveau locataire.
  • Inscrivez une nouvelle application dans le Centre d’administration Microsoft Entra, configurée pour les comptes dans cet annuaire organisationnel uniquement. Pour plus d’informations, reportez-vous à l'enregistrement d'une application. Enregistrez les valeurs suivantes à partir de la page Vue d’ensemble de l’application pour une utilisation ultérieure :
    • ID d’application (client)
    • ID d’annuaire (locataire)
  • Ajoutez une clé secrète client à votre inscription d’application. N’utilisez pas les secrets client dans les applications de production. Utilisez plutôt des certificats ou des informations d’identification fédérées. Pour plus d’informations, consultez ajouter des informations d’identification à votre application.

Créer un projet Flask

  1. Créez un dossier pour héberger votre application Flask, telle que flask-web-app.

  2. Ouvrez une fenêtre de console et accédez au répertoire de votre dossier d’application web Flask à l’aide de la commande

    cd flask-web-app

  3. Configurer un environnement virtuel

    Selon votre système d’exploitation, exécutez les commandes suivantes pour configurer votre environnement virtuel et l’activer :

    Pour le système d’exploitation Windows :

    py -m venv .venv
.venv\scripts\activate

    Pour le système d’exploitation macOS ou Linux :

    python3 -m venv .venv
source .venv/bin/activate

Installer les dépendances d’application

Pour installer les dépendances d’application, exécutez les commandes suivantes :

pip install flask
pip install python-dotenv
pip install requests
pip install "ms_identity_python[flask] @ git+https://github.com/azure-samples/ms-identity-python@0.9"

La bibliothèque ms_identity_python que vous installez installe automatiquement la bibliothèque d’authentification Microsoft (MSAL) pour Python comme dépendance. MSAL Python est la bibliothèque qui vous permet d’authentifier les utilisateurs et de gérer leurs jetons d’accès.

Après avoir installé les bibliothèques requises, mettez à jour votre fichier requis en exécutant la commande suivante :

pip freeze > requirements.txt

Configurer l’application pour l’authentification

Les applications web qui identifient des utilisateurs à l'aide de la plateforme d'identités Microsoft sont configurées par le biais d'un fichier de configuration .env. Dans Python Flask, il doit spécifier les valeurs suivantes :

Variable d’environnement Descriptif
AUTHORITY URL de l’instance cloud où l’application est inscrite. Format : https://{Instance}/{TenantId}. Utilisez l’une des valeurs d’instance suivantes :
- https://login.microsoftonline.com/ (Azure cloud public)
- https://login.microsoftonline.us/ (Azure gouvernement des États-Unis)
- https://login.microsoftonline.de/ (Microsoft Entra Germany)
- https://login.partner.microsoftonline.cn/ (Microsoft Entra China, géré par 21Vianet)
TENANT_ID Identificateur du locataire où l’application est inscrite. Préférez l’ID de locataire à partir de l’inscription de l’application ou utilisez l’un des suivants :
- organizations: connecter des utilisateurs dans n’importe quel compte professionnel ou scolaire
- common: connecter des utilisateurs avec un compte professionnel ou scolaire ou un compte personnel Microsoft
- consumers: connecter des utilisateurs avec un compte personnel Microsoft uniquement
CLIENT_ID Identificateur de l’application (client) obtenue à partir de l’inscription de l’application.
CLIENT_SECRET Valeur secrète obtenue à partir de l’ajout d’informations d’identification dans le Centre d’administration Microsoft Entra.
REDIRECT_URI URI où la plateforme d’identités Microsoft envoie des jetons de sécurité après l’authentification.

Mettre à jour le fichier de configuration

  1. Créez un fichier .env dans votre dossier racine pour stocker en toute sécurité la configuration de votre application. Votre fichier .env doit contenir les variables d’environnement suivantes :

    CLIENT_ID="<Enter_your_client_id>"
CLIENT_SECRET="<Enter_your_client_secret>"
AUTHORITY="https://login.microsoftonline.com/<Enter_tenant_id>"
REDIRECT_URI="<Enter_redirect_uri>"

    Remplacez les espaces réservés par les valeurs suivantes :

    • Remplacez <Enter_your_client_id> par l’ID d’application (client) de l’application web cliente que vous avez inscrite.
    • Remplacez <Enter_tenant_id> par l’ID d’annuaire (locataire) où vous avez inscrit votre application web.
    • Remplacez <Enter_your_client_secret> par la valeur de clé secrète client pour l’application web que vous avez créée. Dans ce tutoriel, nous utilisons des secrets à des fins de démonstration. En production, utilisez des approches plus sécurisées telles que des certificats ou des informations d’identification d’identité fédérée.
    • Remplacez <Enter_redirect_uri> par l’URI de redirection que vous avez inscrit précédemment. Ce tutoriel définit le chemin d’URI de redirection vers http://localhost:3000/getAToken.

  2. Créez un fichier app_config.py pour lire les variables d’environnement et ajouter d’autres configurations dont vous avez besoin.

    import os

AUTHORITY = os.getenv("AUTHORITY")
CLIENT_ID = os.getenv("CLIENT_ID")
CLIENT_SECRET = os.getenv("CLIENT_SECRET")
REDIRECT_URI = os.getenv("REDIRECT_URI")
SESSION_TYPE = "filesystem" # Tells the Flask-session extension to store sessions in the filesystem. Don't use in production apps.

Configurer des points de terminaison d’application

À ce stade, vous créez vos points de terminaison d’application web et ajoutez la logique métier à votre application.

  1. Créez un fichier appelé app.py dans votre dossier racine.

  2. Importez les dépendances requises en haut du fichier app.py .

    import os
import requests
from flask import Flask, render_template
from identity.flask import Auth
import app_config

  3. Initialisez votre application Flask et configurez-la pour utiliser le type de stockage de session que vous avez spécifié dans votre fichier app_config.py .

    app = Flask(__name__)
app.config.from_object(app_config)

  4. Initialisez le client d’application. Une application web Flask est un client confidentiel. Nous transmettons la clé secrète client, car les clients confidentiels peuvent le stocker en toute sécurité. Sous le capot, la bibliothèque d’identité appelle la classe ConfidentialClientApplication de la bibliothèque MSAL.

    auth = Auth(
    app,
    authority=app.config["AUTHORITY"],
    client_id=app.config["CLIENT_ID"],
    client_credential=app.config["CLIENT_SECRET"],
    redirect_uri=app.config["REDIRECT_URI"]
)

  5. Ajoutez les points de terminaison requis à votre application Flask. L’application web utilise le flux de code d’autorisation pour connecter l’utilisateur. La bibliothèque de wrapper MSAL ms_identity_python permet d’interagir avec la bibliothèque MSAL, ce qui facilite l’ajout de la connexion et la déconnexion à votre application. Nous ajoutons une page d’index et la protégez à l’aide du login_required décorateur fourni par la bibliothèque ms_identity_python . Le login_required décorateur garantit que seuls les utilisateurs authentifiés peuvent accéder à la page d’index.

    @app.route("/")
@auth.login_required
def index(*, context):
    return render_template(
        'index.html',
        user=context['user'],
        title="Flask Web App Sample",
    )

    L’utilisateur est garanti d’être présent parce que nous avons décoré cette vue avec @login_required.

Créer les modèles d’application

Créez un dossier appelé modèles dans votre dossier racine. Dans le dossier modèles, créez un fichier appelé index.html. Il s’agit de la page d’accueil de l’application. Ajoutez le code suivant au fichier index.html :

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{{ title }}</title>
</head>
<body>
    <h1>{{ title }}</h1>
    <h2>Welcome {{ user.get("name") }}!</h2>

    <img src="https://github.com/Azure-Samples/ms-identity-python-webapp-django/raw/main/static/topology.png" alt="Topology">

    <ul>
    {% if api_endpoint %}
        <!-- If an API endpoint is declared and scopes defined, this link will show. We set this in the call an API tutorial. For this tutorial, we do not define this endpoint. -->
        <li><a href='/call_api'>Call an API</a></li>
    {% endif %}

    <li><a href="{{ url_for('identity.logout') }}">Logout</a></li>
    </ul>

    <hr>
    <footer style="text-align: right">{{ title }}</footer>
</body>
</html>

Exécuter et tester l’exemple d’application web

  1. Dans votre terminal, exécutez la commande suivante :

    python3 -m flask run --debug --host=localhost --port=3000

    Vous pouvez utiliser le port de votre choix. Ce port doit être similaire au port de l’URI de redirection que vous avez enregistré précédemment.

  2. Ouvrez votre navigateur, puis accédez à http://localhost:3000. Vous voyez une page de connexion.

  3. Connectez-vous avec votre compte Microsoft en suivant les étapes. Vous êtes invité à fournir une adresse e-mail et un mot de passe pour vous connecter.

  4. Si des étendues sont nécessaires à l'application, un écran de consentement est présenté. L’application demande l’autorisation de conserver l’accès aux données que vous avez autorisées et pour vous connecter. Sélectionnez Accepter. Cet écran n’apparaît pas si aucune étendue n’est définie.

Après vous être connecté ou inscrit, vous êtes redirigé vers l’application web. Vous voyez une page qui ressemble à la capture d’écran suivante :

Capture d’écran de l’exemple d’application web flask après l’authentification réussie.

Sélectionnez Déconnexion pour vous déconnecter de l’application. Vous êtes invité à choisir un compte à partir duquel vous vous déconnectez. Sélectionnez le compte que vous avez utilisé pour vous connecter.

Utiliser un domaine d’URL personnalisé (facultatif)

Les locataires de main-d’œuvre ne prennent pas en charge les domaines d’URL personnalisés.

  • Last updated on