Tutoriel : Utiliser l’infrastructure web Flask dans Visual Studio

Cet article est la première étape d’une série de tutoriels en trois parties qui montre comment utiliser Flask dans Visual Studio. flask est une infrastructure Python légère pour les applications web qui fournit les principes de base du routage d’URL et du rendu de page. Flask est appelé framework « micro », car il ne fournit pas directement de fonctionnalités telles que la validation de formulaire, l’abstraction de base de données, l’authentification, et ainsi de suite. Ces fonctionnalités sont plutôt fournies par des packages Python spéciaux appelés extensions Flask . Les extensions s’intègrent en toute transparence à Flask afin qu’elles apparaissent comme si elles font partie de Flask elle-même. Par exemple, Flask lui-même ne fournit pas de moteur de modèle de page. La création de modèles est fournie par des extensions telles que Jinja et Jade, comme illustré dans ce tutoriel.

À l’étape 1 du didacticiel, vous allez apprendre à :

Ce tutoriel diffère du guide de démarrage rapide Flask. Vous en apprendrez davantage sur Flask et sur l’utilisation des modèles de projet Flask pour fournir un point de départ plus complet pour vos projets. Les modèles installent automatiquement le package Flask lorsque vous créez un projet, tandis que le guide de démarrage rapide a montré comment installer le package manuellement.

Conditions préalables

Les modèles de projet Flask sont inclus avec toutes les versions antérieures de Python Tools pour Visual Studio. Les détails du modèle peuvent différer des descriptions de ce didacticiel.

Visual Studio pour Mac n’est pas pris en charge. Pour plus d’informations, consultez Qu’est-ce qui se passe dans Visual Studio pour Mac ? Visual Studio Code sur Windows, Mac et Linux fonctionne correctement avec Python via des extensions disponibles.

Créer une solution Visual Studio et un projet Flask

À l’étape 1 de ce didacticiel, vous créez une solution Visual Studio unique pour contenir deux projets Flask distincts. Vous créez les projets à l’aide de différents modèles de projet Flask inclus dans Visual Studio. En conservant les projets dans la même solution, vous pouvez facilement basculer entre différents fichiers à des fins de comparaison.

Suivez cette procédure pour créer la solution et un projet web Flask :

Examiner les contrôles Git

À mesure que vous parcourez ce didacticiel, prenez l’habitude d’utiliser régulièrement les contrôles Git dans Visual Studio pour valider et envoyer (push) les modifications. Ce tutoriel vous rappelle les points appropriés.

Utiliser le contrôle de code source à partir du début

Il existe plusieurs avantages à l’utilisation du contrôle de code source à partir du début d’un projet. Lorsque vous utilisez le contrôle de code source à partir du début d’un projet, en particulier si vous utilisez également un référentiel distant, vous bénéficiez d’une sauvegarde hors site régulière de votre projet. Contrairement à la maintenance d’un projet uniquement sur un système de fichiers local, le contrôle de code source fournit également un historique des modifications complet et la possibilité facile de rétablir un fichier unique ou l’ensemble du projet à un état précédent. L’historique des modifications permet de déterminer la cause des régressions (échecs de test).

Le contrôle de code source est essentiel si plusieurs personnes travaillent sur un projet, car elle gère les remplacements et fournit une résolution des conflits. Le contrôle de code source est fondamentalement une forme d’automatisation, vous permet d’automatiser les builds, les tests et la gestion des mises en production. C’est la première étape de l’utilisation d’Azure DevOps pour un projet, et parce que les obstacles à l’entrée sont si faibles, il n’y a vraiment aucune raison de ne pas utiliser le contrôle de code source depuis le début.

Pour plus d’informations sur le contrôle de code source en tant qu’automatisation, consultez The Source of Truth : The Role of Repository in DevOps, un article de MSDN Magazine écrit pour les applications mobiles qui s’applique également aux applications web.

Empêcher Visual Studio de valider automatiquement des projets

Procédez comme suit pour empêcher Visual Studio de valider automatiquement un nouveau projet :

Créer un environnement virtuel et exclure le contrôle de code source

Après avoir configuré le contrôle de code source pour votre projet, vous pouvez créer l’environnement virtuel avec les packages Flask nécessaires dont le projet a besoin. Vous pouvez ensuite utiliser la fenêtre Modifications Git pour exclure le dossier de l’environnement du contrôle de code source.

Comprendre l’objectif des environnements virtuels

Un environnement virtuel est un excellent moyen d’isoler les dépendances exactes de votre application. Cette méthode d’isolation évite les conflits au sein d’un environnement Python global et facilite les tests et la collaboration. Au fil du temps, lorsque vous développez une application, vous apportez invariablement de nombreux packages Python utiles. En conservant les packages dans un environnement virtuel spécifique au projet, vous pouvez facilement mettre à jour le fichier requirements.txt du projet qui décrit cet environnement, qui est inclus dans le contrôle de code source. Lorsque vous copiez le projet sur d’autres ordinateurs, notamment des serveurs de build, des serveurs de déploiement et d’autres ordinateurs de développement, il est facile de recréer l’environnement. Vous pouvez recréer l’environnement en utilisant uniquement le fichier requirements.txt, c’est pourquoi l’environnement n’a pas besoin d’être dans le contrôle de code source. Pour plus d’informations, consultez Utiliser des environnements virtuels.

Supprimer un environnement virtuel sous contrôle de code source

Vous pouvez supprimer un environnement virtuel une fois qu’il est sous contrôle de code source. Procédez comme suit :

1. Modifiez votre fichier .gitignore pour exclure le dossier :

   1. Ouvrez le fichier en sélectionnant Fichier>Ouvrir>fichier.

      Vous pouvez également ouvrir le fichier à partir de Team Explorer. Sur la page Paramètres, sélectionnez Paramètres du référentiel. Accédez à la section Ignorer les attributs de fichiers & et sélectionnez le lien Modifier à côté de .gitignore.

   2. Recherchez la section à la fin qui contient le commentaire # Python Tools for Visual Studio (PTVS).

   3. Après cette section, ajoutez une nouvelle ligne pour le dossier d’environnement virtuel, par exemple /BasicProject/env.

2. Ouvrez une fenêtre de commande et accédez au dossier (par exemple, BasicProject) qui contient le dossier d’environnement virtuel, tel que env.

3. Exécutez la commande git rm -r env pour supprimer l’environnement virtuel actuellement sous contrôle de code source.

4. Validez vos modifications avec la commande git commit -m 'Remove venv', ou validez-les à partir de la page Modifications de Team Explorer.

Examiner le code type

Dans cette section, vous examinez le code standard dans le fichier Projet (.py) que Visual Studio crée en fonction de votre sélection de modèle.

1. Ouvrez Explorateur de solutions pour afficher vos fichiers solution et projet. Le projet initial contient seulement deux fichiers, app.py et requirements.txt:

   

   Le fichier requirements.txt spécifie les dépendances du package Flask. La présence de ce fichier est ce qui vous invite à créer un environnement virtuel lors de la première création du projet.

   Le fichier app.py seul contient du code standard pour un projet web Flask vide.

2. Ouvrez le fichier app.py dans l’éditeur et examinez la première section, une instruction import pour Flask.

   Cette instruction crée une instance de la classe Flask, qui est affectée à la variable app. Cette section affecte également une variable wsgi_app (qui est utile lorsque vous déployez sur un hôte web, mais qui n’est pas utilisée pour l’instant) :

   from flask import Flask
   app = Flask(__name__)
   
   # Make the WSGI interface available at the top level so wfastcgi can get it.
   wsgi_app = app.wsgi_app
   

3. La deuxième section à examiner se produit à la fin du fichier. Cette section contient du code facultatif que vous pouvez utiliser pour démarrer le serveur de développement Flask.

   Vous pouvez définir le code pour utiliser des valeurs d’hôte et de port spécifiques prises à partir de variables d’environnement, ou utiliser l’hôte et la valeur de port par défaut localhost:55551.

   if __name__ == '__main__':
       import os
       HOST = os.environ.get('SERVER_HOST', 'localhost')
       try:
           PORT = int(os.environ.get('SERVER_PORT', '5555'))
       except ValueError:
           PORT = 5555
       app.run(HOST, PORT)
   

4. La troisième section du code à examiner affecte une fonction à une route d’URL, ce qui signifie que la fonction fournit la ressource identifiée par l’URL.

   Vous définissez des itinéraires à l’aide du décorateur @app.route de Flask avec un argument qui est l’URL relative à partir de la racine du site. Comme vous pouvez le voir dans le code, la fonction retourne uniquement une chaîne de texte, qui est suffisante pour qu’un navigateur s’affiche. Dans les étapes suivantes de cette série de tutoriels, vous mettez à jour le code pour afficher des pages plus riches avec du code HTML.

   @app.route('/')
   def hello():
       """Renders a sample page."""
       return "Hello World!"
   

Comprendre l’argument nom dans la classe Flask

L’argument name dans une classe Flask est le nom du module ou du package de l’application. Flask utilise le nom pour déterminer où rechercher des modèles, des fichiers statiques et d’autres ressources appartenant à l’application. Pour les applications contenues dans un seul module, __name__ est toujours la valeur appropriée. Le nom est également important pour les extensions qui requièrent des informations de débogage. Pour plus d’informations et d’autres arguments, consultez la documentation de la classe Flask (flask.pocoo.org).

Utiliser plusieurs décorateurs d’itinéraire

Une fonction peut avoir plusieurs décorateurs d’itinéraire. Vous pouvez utiliser autant de décorateurs que vous le souhaitez si la même fonction sert plusieurs itinéraires. Par exemple, pour utiliser la fonction hello pour l’itinéraire / et l’itinéraire /hello, utilisez le code suivant :

@app.route('/')
@app.route('/hello')
def hello():
    """Renders a sample page."""
    return "Hello World!"

Utiliser des itinéraires d’URL variables et des paramètres de requête

Flask peut utiliser des itinéraires d’URL variables et des paramètres de requête. Dans un itinéraire, vous marquez n’importe quelle variable avec l’attribut <variable_name>. Flask transmet la variable à la fonction à l’aide d’un argument nommé dans le chemin d’URL. Par exemple, une route sous la forme de /hello/<name> génère un argument de chaîne appelé name à la fonction. Les paramètres de requête sont disponibles via la propriété request.args, en particulier par le biais de la méthode request.args.get. Le code suivant fournit un exemple :

# URL: /hello/<name>?message=Have%20a%20nice%20day
@app.route('/hello/<name>')
def hello(name):
    msg = request.args.get('message','')
    return "Hello " + name + "! "+ msg + "."

Pour modifier le type, préfixez la variable avec int, float, path (qui accepte les barres obliques pour délimiter les noms de dossiers) et uuid. Pour plus d’informations, consultez les règles de variables dans la documentation Flask.

Générer des exigences après l’installation du package

Visual Studio peut générer un fichier requirements.txt à partir d’un environnement virtuel après avoir installé d’autres packages.

• Dans Explorateur de solutions, développez le nœud Environnements Python, cliquez avec le bouton droit sur votre environnement virtuel, puis sélectionnez Générer requirements.txt.

Il est recommandé d’utiliser cette commande régulièrement lorsque vous modifiez l’environnement. Validez les modifications apportées à votre fichier requirements.txt dans le contrôle de code source, ainsi que les autres modifications de code qui dépendent de cet environnement. Si vous configurez l’intégration continue sur un serveur de build, vous devez générer le fichier et valider les modifications chaque fois que vous modifiez l’environnement.

Exécuter le projet

Vous êtes maintenant prêt à exécuter votre projet dans Visual Studio en suivant cette procédure :

1. Dans Visual Studio, sélectionnez Déboguer>Démarrer le débogage (F5) ou sélectionnez Serveur Web dans la barre d’outils principale (le navigateur que vous utilisez peut varier) :

   

2. L’une ou l’autre commande affecte un numéro de port aléatoire à la variable d’environnement PORT et exécute le fichier app.py Python.

   Le code démarre l’application à l’aide de ce port dans le serveur de développement Flask.

   Si Visual Studio publie le message Impossible de démarrer le débogueur et indique qu’aucun fichier de démarrage n’est trouvé, cliquez avec le bouton droit sur le fichier app.py dans l’Explorateur de solutions et sélectionnez Définir comme fichier de démarrage.

3. Au démarrage du serveur, une fenêtre de console s’ouvre pour afficher le journal du serveur. Visual Studio ouvre automatiquement un navigateur pour http://localhost:<port>, où vous devez voir le message affiché par la fonction hello :

   

4. Lorsque vous avez terminé, fermez la fenêtre de console, ce qui arrête le serveur de développement Flask. Vous pouvez également sélectionner Déboguer>Arrêter le débogage.

Comparer les commandes Debug avec les commandes Python de projet

Il existe une différence entre l’utilisation des commandes de menu de débogage et les commandes de serveur répertoriées dans le sous-menu Python du projet.

Les deux commandes ouvrent une fenêtre de console dans laquelle vous voyez l’URL locale (localhost:port) pour le serveur en cours d’exécution. Toutefois, vous devez ouvrir manuellement un navigateur avec cette URL et exécuter le serveur de débogage ne démarre pas automatiquement le débogueur Visual Studio. Vous pouvez attacher un débogueur au processus en cours d'exécution ultérieurement, si vous le souhaitez, en utilisant la commande Déboguer>Attacher au processus.

Étape suivante