Déployer sur Azure

  • 7 minutes

Cet exercice nécessite un bac à sable. Un bac à sable vous donne accès aux ressources gratuites. Votre abonnement personnel ne sera pas facturé.

Vous pouvez uniquement utiliser le bac à sable pour suivre une formation sur Microsoft Learn. Toute utilisation pour une autre raison est interdite et peut entraîner la perte permanente de l’accès au bac à sable.

Pour que votre site soit accessible au public, vous allez le déployer dans Azure. Vous utiliserez l’extension Azure App Service dans Visual Studio Code pour simplifier le processus.

Installer l’extension Azure App Service

Commencez par installer l’extension Azure App Service dans Visual Studio Code :

  1. Dans Visual Studio Code, sélectionnez l’icône Extensions.

    Screenshot showing the Extensions icon.

  2. Dans le champ Rechercher des extensions, tapez App Service.

  3. Sous Azure App Service, sélectionnez Installer.

Si vous disposez déjà de l’extension Azure App Service, vérifiez qu’elle est mise à jour vers la dernière version. Regardez la date de la dernière mise à jour sur la page de l’extension. Si vous utilisez la dernière version, vous devez voir un nœud RESOURCES avec un nœud App Services.

Déployer l’application

Quand vous avez suivi les étapes pour cloner le référentiel de démarrage, vous avez aussi dû changer de répertoire pour le dossier starter avant d’ouvrir VS Code. Le répertoire starter contient le fichier manage.py qui signale à App Service que vous déployez une application web Django.

  1. Dans la barre d’outils de Visual Studio Code, sélectionnez l’icône Azure.

    Screenshot showing the Azure icon.

  2. Sélectionnez Se connecter pour vous connecter à Azure en utilisant le compte que vous avez utilisé pour créer le bac à sable.

  3. Dans la barre RESSOURCES de l’extension Azure, placez le curseur sur l’icône + (signe plus) et sélectionnez-la pour créer une ressource.

    Screenshot showing the App Service bar. The Deploy icon is highlighted.

  4. Si vous êtes invité à choisir un abonnement, choisissez votre abonnement Azure.

  5. Sélectionnez Créer une application web Azure App Service….

    Screenshot showing how to create a new web app.

  6. Donnez un nom unique à votre application.

    Screenshot showing where to provide an app name.

  7. Sélectionnez Python 3.9 comme pile d’exécution.

    Screenshot showing the runtime stack selection.

  8. Sélectionnez un niveau tarifaire.

    Screenshot showing the the pricing tier selection.

    L’extension crée votre application web. Le processus prend quelques instants.

  9. Une fois l’application web créée, vous êtes invité à déployer l’application web sur App Service. Sélectionnez Déployer.

    Screenshot showing the deployment configuration option.

    Si vous avez manqué la notification pour déployer l’application ou si vous l’avez fermée, vous pouvez aussi déployer en recherchant l’e service App Service que vous avez créé, en cliquant sur celui-ci avec le bouton droit, puis en sélectionnant Déployer sur l’application web.

Votre site va maintenant être déployé !

Créer le serveur de base de données

Créez maintenant la base de données PostgreSQL.

  1. Dans la barre RESSOURCES de l’extension Azure, placez le curseur sur l’icône + (signe plus) et sélectionnez-la pour créer une ressource.

    Screenshot of the Databases extension, showing the Create Server icon.

  2. Si vous êtes invité à choisir un abonnement, choisissez votre abonnement Azure.

  3. Sélectionnez Créer un serveur de base de données….

    Screenshot showing how to create a new database server.

  4. Pour le serveur de base de données Azure, sélectionnez le serveur flexible PostgreSQL.

    Screenshot showing a list of available database servers.

  5. Donnez un nom unique à votre serveur de base de données.

    Important

    Notez le nom que vous donnez à votre serveur de base de données.

  6. Sélectionnez la référence SKU et les options Postgres.

  7. Pour le nom de l’utilisateur administrateur, entrez shelter_admin.

  8. Entrez un mot de passe sécurisé, par exemple « 86i^z5#emSk6wu3t10nC* ».

    Important

    Quand vous créez le mot de passe, n’utilisez pas le signe dollar ($). Ce symbole peut causer des problèmes de connexion à partir de Python. Notez le mot de passe choisi.

  9. Entrez le mot de passe une deuxième fois pour le confirmer.

  10. Pour le groupe de ressources, sélectionnez le même groupe de ressources que celui où votre application web a été créée.

    Pour trouver le nom et l’emplacement du groupe de ressources utilisés pour créer l’application web, recherchez le service App Service dans l’extension Azure, cliquez avec le bouton droit sur le nom, puis sélectionnez Afficher les propriétés. Dans la clé « id », le nom du groupe de ressources est la partie qui suit « /resourceGroups/ ». La clé « location » montre l’emplacement.

    Vous pouvez aussi cliquer avec le bouton droit sur le nom du service App Service, puis sélectionner Ouvrir dans le portail pour trouver le nom et l’emplacement du groupe de ressources.

  11. Pour l’emplacement des nouvelles ressources, sélectionnez le même emplacement que celui du groupe de ressources et de l’application web.

    Important

    Quand vous créez plusieurs ressources Azure qui communiquent les unes avec les autres, vous devez toujours les placer dans la même région. Cette colocalisation garantit les meilleures performances.

Votre serveur va maintenant être créé ! Ce processus prend quelques minutes.

Créer une règle de pare-feu de base de données pour autoriser l’accès à partir de votre environnement de développement

Une fois la base de données créée, vous devez créer une règle de pare-feu pour permettre à votre environnement de développeur d’accéder à la base de données. Patientez jusqu’à ce que la base de données existe pour suivre les étapes suivantes pour créer la règle.

  1. Ouvrez la palette de commandes Visual Studio Code avec F1 ou la combinaison de touches Ctrl + Maj + P.

  2. Recherchez « PostgreSQL : configurer le pare-feu » et sélectionnez l’option.

    Screenshot showing the firewall rule field.

  3. Quand vous êtes invité à indiquer la ressource auquel appliquer le pare-feu, sélectionnez la base de données Postgres que vous avez créée.

  4. Une dernière boîte de dialogue vous demande de continuer et affiche l’adresse IP qui va être ajoutée. Sélectionnez Oui.

L’ajout de la règle prend quelques minutes. Consultez la fenêtre de notification de VS Code pour connaître l’état.

Créer une base de données sur le serveur de base de données

Maintenant que vous avez configuré App Service et créé le serveur, vous pouvez créer la base de données dans le serveur de base de données Postgres.

  1. Dans les RESSOURCES de l’extension Azure Tools, développez le nœud Serveurs PostgreSQL (flexible) et recherchez le serveur que vous avez créé.

  2. Cliquez avec le bouton droit sur le nom de votre serveur de base de données et sélectionnez Créer une base de données.

    Screenshot showing the Create Database selection.

  3. Entrez shelters.

Votre base de données est créée.

Autoriser l’accès au serveur de base de données à partir d’App Service

Dans cet exercice, vous avez également besoin de l’application web « dog shelters » (refuges pour chiens) hébergée dans Azure App Service pour vous connecter à Azure Database pour PostgreSQL - Serveur flexible. Quand une application dans Azure tente de se connecter à votre serveur de base de données, le pare-feu vérifie que les connexions Azure sont autorisées. Vous avez auparavant autorisé les connexions à partir de votre environnement local. À présent, vous devez aussi autoriser les connexions à partir d’App Service.

  1. Dans VS Code, dans les RESSOURCES de l’extension Azure Tools, développez le nœud Serveurs PostgreSQL (flexibles) et recherchez le serveur que vous avez créé.

  2. Cliquez avec le bouton droit sur le nom de votre serveur de base de données et sélectionnez Ouvrir dans le portail.

  3. Sélectionnez la ressource Réseau du serveur Postgres.

  4. Sélectionnez l’option Autoriser l’accès public à partir de n’importe quel service Azure dans Azure vers ce serveur dans le portail à partir de l’onglet Réseau, puis sélectionnez Enregistrer.

    Screenshot showing the how to allow public access to database server.

Configurer les paramètres d’application pour l’application web

App Service utilise les paramètres d’application pour configurer des variables d’environnement. Les paramètres sont un moyen pratique de stocker des informations que vous ne devriez pas placer dans votre code, comme les chaînes de connexion de base de données.

  1. Sous App Service, développez l’abonnement bac à sable. Ensuite, développez votre application.

  2. Pour créer le premier paramètre d’application, cliquez avec le bouton droit sur Paramètres d’application, puis sélectionnez Ajouter un nouveau paramètre.

    Screenshot showing how to add a new setting.

  3. Dans le premier champ, entrez le nom DBUSER.

  4. Dans le deuxième champ, entrez la valeur shelter_admin.

  5. Répétez les étapes précédentes pour créer les paramètres restants :

    Name Valeur
    DBHOST <The server name you created previously>
    DBPASS <The password you created previously>
    DBUSER shelter_admin
    DBNAME shelters
    SECRET_KEY <Generate a secure password>

    Notes

    Remplacez les valeurs DBHOST et DBPASS par celles créées précédemment dans cet exercice. Pour SECRET_KEY, créez un mot de passe.

Toutes les variables d’environnement nécessaires sont maintenant créées sur votre service d’application.

Créer le schéma et le superutilisateur

La dernière étape du déploiement consiste à configurer la base de données. Dans le développement local, vous exécutez python manage.py migrate et python manage.py createsuperuser pour créer le schéma de la base de données et le superutilisateur. Sur Azure, la procédure est la même.

Vous allez vous connecter au serveur web dans Azure avec Secure Shell (SSH). Vous pouvez établir la connexion dans Visual Studio Code comme indiqué ci-dessous.

  1. Dans l’extension App Service, cliquez avec le bouton droit sur votre service d’application, puis sélectionnez SSH dans l’application web.

    Screenshot of the menu for SSH.

    Une connexion SSH est établie à votre serveur web dans Azure. Ce processus peut prendre quelques minutes. Un volet de terminal s’affiche dans Visual Studio Code. Ce terminal est la connexion SSH à votre serveur web. Si vous rencontrez des problèmes de connexion, consultez les étapes de résolution des problèmes ci-dessous.

    Important

    Si vous recevez un message d’erreur indiquant que vous devez activer SSL pour la base de données, vérifiez que toutes les variables d’environnement ont été correctement créées.

  2. Dans le volet du terminal SSH, exécutez les commandes suivantes pour vérifier que les bibliothèques appropriées sont installées et créer la base de données.

    # Run database migrations
python manage.py makemigrations dog_shelters
python manage.py migrate

  3. Exécutez la commande suivante pour créer votre superutilisateur.

    python manage.py createsuperuser

  4. Entrez un nom, une adresse e-mail et un mot de passe pour le superutilisateur.

  5. Après avoir créé votre superutilisateur, exécutez la commande exit pour fermer la connexion.

Votre base de données est maintenant configurée dans Azure, et vous avez un superutilisateur pour votre site.

Résolution des problèmes liés à SSH

Si vous ne pouvez pas vous connecter à SSH à partir de VS Code, voici quelques actions que vous pouvez essayer :

  • Accédez à la page du portail Azure pour le service App Service et accédez à partir de là à SSH. Dans VS Code, cliquez avec le bouton droit sur le nom du service App Service, puis sélectionnez Ouvrir dans le portail. Dans la page du portail pour le service App Service, accédez aux ressources SSH dans le volet des ressources à gauche.

  • Vérifiez que le service App Service hébergeant l’application web a démarré correctement. S’il y a eu une erreur de déploiement ou un problème de codage, le service App Service n’a peut-être pas démarré et vous ne pouvez pas y accéder via SSH. Dans la page du portail pour le service App Service, accédez à Diagnostiquer et résoudre les problèmes dans le volet des ressources à gauche pour examiner les problèmes.

  • En savoir plus sur SSH dans App Service.

Accéder à votre site

Une fois que tout est déployé et configuré, vous pouvez consulter votre site web sur Azure.

Dans l’extension App Service, cliquez avec le bouton droit sur le nom de votre site, puis sélectionnez Parcourir le site web.

Screenshot showing where to select Browse Website.

Votre site web s’affiche. La page par défaut n’affiche aucun refuge. Pour ajouter des refuges :

  1. Accédez à la partie d’administration Django du site en ajoutant « /admin » à l’URL du site web.

    Vous êtes invité à vous authentifier avec le nom et le mot de passe de superutilisateur que vous avez créés ci-dessus.

  2. Ajoutez un refuge et revenez à la page principale. Vous pouvez alors inscrire un chien pour ce refuge.

Voici un exemple de capture d’écran du site :

Screenshot showing Django admin and how to add shelters.

Si vous essayez d’accéder à un emplacement qui n’existe pas sur votre site, vous obtenez une erreur Introuvable générique dans la mesure où DEBUG est désactivé.

Vous venez de déployer un site web sur Azure !