Tutoriel : Déployer une application web Node.js + MongoDB sur Azure

Article
10/03/2024

Azure App Service fournit un service d’hébergement web hautement évolutif et appliquant des mises à jour correctives automatiques en utilisant le système d’exploitation Linux. Ce tutoriel montre comment créer, dans Azure App Service, une application Node.js sécurisée et connectée à une base de Azure Cosmos DB for MongoDB. Quand vous aurez terminé, vous disposerez d’une application Express.js s’exécutant sur Azure App Service sur Linux.

Capture d’écran de l’application Node.js stockant les données dans Cosmos DB.

Dans ce tutoriel, vous allez apprendre à :

Créer une architecture sécurisée par défaut pour Azure App Service et Azure Cosmos DB avec l’API MongoDB.
Sécuriser les secrets de connexion à l’aide d’une identité managée et de références Key Vault.
Déployer un exemple d’application Node.js sur App Service à partir d’un dépôt GitHub.
Accéder aux paramètres d’application App Service dans le code de l’application.
Effectuer des mises à jour, et redéployer le code de l’application.
Transmettre en continu des journaux de diagnostic à partir d’App Service.
Gérer l’application dans le portail Azure.
Approvisionner la même architecture et la déployer à l’aide d’Azure Developer CLI.
Optimiser votre workflow de développement avec GitHub Codespaces et GitHub Copilot.

Prérequis

Compte Azure avec un abonnement actif. Si vous ne possédez pas de compte Azure, vous pouvez créer un compte gratuit.
Un compte GitHub. Vous pouvez aussi en obtenir un gratuitement.
Connaissance du développement Express.js.
(Facultatif) Pour essayer GitHub Copilot, un compte GitHub Copilot. Un essai gratuit de 30 jours est disponible.

Compte Azure avec un abonnement actif. Si vous ne possédez pas de compte Azure, vous pouvez créer un compte gratuit.
Azure Developer CLI installé. Vous pouvez suivre les étapes avec Azure Cloud Shell, car Azure Developer CLI est déjà installé.
Connaissance du développement Express.js.
(Facultatif) Pour essayer GitHub Copilot, un compte GitHub Copilot. Un essai gratuit de 30 jours est disponible.

Vous pouvez déployer rapidement l’exemple d’application dans ce tutoriel et le voir s’exécuter dans Azure. Exécutez simplement les commandes suivantes dans le Azure Cloud Shell, puis suivez l’invite :

mkdir msdocs-nodejs-mongodb-azure-sample-app
cd msdocs-nodejs-mongodb-azure-sample-app
azd init --template msdocs-nodejs-mongodb-azure-sample-app
azd up

1. Exécution de l'exemple

Tout d’abord, vous configurez un exemple d’application pilotée par les données comme point de départ. Pour plus de commodité, l’exemple de référentiel inclut une configuration de conteneur de développement. Le conteneur de développement dispose de tout ce dont vous avez besoin pour développer une application, notamment la base de données, le cache et toutes les variables d’environnement nécessaires par l’exemple d’application. Le conteneur de développement peut s’exécuter dans un codespace GitHub, ce qui signifie que vous pouvez exécuter l’exemple sur n’importe quel ordinateur avec un navigateur web.

Étape 1 : Dans une nouvelle fenêtre de navigateur :

Connectez-vous à votre compte GitHub.
Accédez à https://github.com/Azure-Samples/msdocs-nodejs-mongodb-azure-sample-app/fork.
Désélectionnez Copier la branche principale uniquement. Vous voulez toutes les branches.
Sélectionnez Créer la duplication.

Étape 2 : dans la fourche GitHub :

Sélectionnez principal>starter-no-infra pour la branche de démarrage. Cette branche contient uniquement l’exemple de projet et aucun fichier ou configuration lié à Azure.
Sélectionnez Code>Créer un codespace sur starter-no-infra. Il faut quelques minutes pour configurer le codespace.

Étape 3 : Dans le terminal codespace :

Exécutez npm install && npm start.
Lorsque la notification Your application running on port 3000 is available. s’affiche, sélectionnez Ouvrir dans le navigateur. Vous devez voir l’exemple d’application dans un nouvel onglet du navigateur. Pour arrêter l’application Express.js, tapez Ctrl+C.

Conseil

Vous pouvez interroger GitHub Copilot à propos de ce référentiel. Par exemple :

@workspace Que fait ce projet ?
@workspace Que fait le dossier .devcontainer ?

Vous rencontrez des problèmes ? Examinez la section Résolution des problèmes.

2. Créer App Service et Azure Cosmos DB

Dans cette étape, vous créez les ressources Azure. La procédure indiquée dans ce tutoriel permet de créer un ensemble de ressources sécurisées par défaut qui incluent App Service et Azure Cosmos DB for MongoDB. Pour le processus de création, vous devez spécifier :

Le nom de l’application web. Il est utilisé dans le cadre du nom DNS de votre application sous la forme https://<app-name>-<hash>.<region>.azurewebsites.net.
La Région du monde où l’application sera physiquement exécutée. Il est également utilisé dans le cadre du nom DNS de votre application.
La Pile du runtime de l’application. C’est là que vous sélectionnez la version de Node à utiliser pour votre application.
Le Plan d’hébergement de l’application. Il s’agit du niveau tarifaire qui inclut l’ensemble des fonctionnalités et la scalabilité de l’application.
Le groupe de ressources pour l’application. Un groupe de ressources vous permet de regrouper (dans un conteneur logique) toutes les ressources Azure nécessaires à l’application.

Connectez-vous au portail Azure et procédez comme suit pour créer vos ressources Azure App Service.

Étape 1 : Dans le Portail Azure :

Entrez « base de données d’application web » dans la barre de recherche située en haut du portail Azure.
Sélectionnez l’élément intitulé Application web + Base de données sous le titre Place de marché. Vous pouvez également accéder directement à l’Assistant de création.

Étape 2 : Dans la page Créer une application web + base de données, remplissez le formulaire comme suit.

Groupe de ressources : Sélectionnez Créer et utilisez un nom comme msdocs-expressjs-mongodb-tutorial.
Région : toute région Azure près de chez vous.
Nom : msdocs-expressjs-mongodb-XYZ, où XYZ représente trois caractères aléatoires quelconques.
Pile d’exécution : Node 20 LTS.
Moteur : Cosmos DB API pour MongoDB. Azure Cosmos DB est une base de données native Cloud qui propose une API 100 % compatible avec MongoDB. Notez le nom de la base de données qui est généré pour vous (<app-name>-database). Vous en aurez besoin ultérieurement.
Nom du plan d’hébergement : Basic. Une fois que vous êtes prêt, vous pouvez effectuer un scale-up vers un niveau tarifaire de production.
Sélectionnez Revoir + créer.
Une fois la validation terminée, sélectionnez Créer.

Étape 3 : Le déploiement prend quelques minutes. Une fois le déploiement terminé, sélectionnez le bouton Accéder à la ressource. L’application App Service s’ouvre automatiquement, mais les ressources suivantes sont créées :

Groupe de ressources → Conteneur pour toutes les ressources créées.
Plan App Service → Définit les ressources de calcul pour App Service. Un plan Linux est créé sur le niveau De base.
App Service → Représente votre application et s’exécute dans le plan App Service.
Réseau virtuel → Intégré à l’application App Service, isole le trafic réseau principal.
Point de terminaison privé → point de terminaison d’accès de la ressource de base de données dans le réseau virtuel.
Interface réseau → représente une adresse IP privée pour le point de terminaison privé.
Azure Cosmos DB for MongoDB → accessible uniquement derrière le point de terminaison privé. Une base de données et un utilisateur sont créés pour vous sur le serveur.
Zone DNS privée → active la résolution DNS du serveur Azure Cosmos DB dans le réseau virtuel.

Vous rencontrez des problèmes ? Examinez la section Résolution des problèmes.

3. Secrets de la connexion sécurisée

L’Assistant Création a déjà généré la chaîne de connectivité pour vous en tant que paramètre d’application. Toutefois, la meilleure pratique de sécurité consiste à éliminer complètement les secrets d’App Service. Vous allez déplacer vos secrets vers un coffre de clés, et remplacer votre paramètre d’application par une référence Key Vault à l’aide des connecteurs de service.

Étape 1 : Dans la page App Service :

Dans le menu de gauche, sélectionnez Paramètres > Variables d’environnement.
En regard de AZURE_COSMOS_CONNECTIONSTRING, sélectionnez Afficher la valeur. Cette chaîne de connexion vous permet de vous connecter à la base de données Cosmos DB sécurisée derrière un point de terminaison privé. Toutefois, le secret est enregistré directement dans l’application App Service, ce qui n’est pas le meilleur. Vous allez changer ça.

Étape 2 : Créer un coffre de clés pour la gestion sécurisée des secrets.

Dans la barre de recherche supérieure, tapez « coffre de clés », puis sélectionnez Place de marché>Coffre de clés.
Dans Groupe de ressources, sélectionnez msdocs-expressjs-mongodb-tutorial.
Dans nom du coffre de clés, tapez un nom composé uniquement de lettres et de chiffres.
Dans région, définissez-la sur l’exemple d’emplacement en tant que groupe de ressources.

Étape 3 :

Sélectionnez l’onglet Réseau.
Désélectionnez Activer l’accès public.
Séllectionnez Créer un point de terminaison privé.
Dans Groupe de ressources, sélectionnez msdocs-expressjs-mongodb-tutorial.
Dans nom du coffre de clés, tapez un nom composé uniquement de lettres et de chiffres.
Dans région, définissez-la sur l’exemple d’emplacement en tant que groupe de ressources.
Dans la boîte de dialogue, dans Emplacement,sélectionnez le même emplacement que votre application App Service.
Dans Groupe de ressources, sélectionnez msdocs-expressjs-mongodb-tutorial.
Dans Nom, tapez msdocs-expressjs-mongodb-XYZVaultEndpoint.
Dans Réseau virtuel, sélectionnez msdocs-expressjs-mongodb-XYZVnet.
Dans Sous-réseau, msdocs-expressjs-mongodb-XYZSubnet.
Cliquez sur OK.
Sélectionnez Vérifier + créer, puis sélectionnez Créer. Attendez que le déploiement du coffre de clés se termine. Vous devez voir « Votre déploiement est terminé ».

Étape 4 :

Dans la barre de recherche supérieure, tapez msdocs-expressjs-mongodb, puis la ressource App Service appelée msdocs-expressjs-mongodb-XYZ.
Sur la page App Service, dans le menu de gauche, sélectionnez Paramètres > Connecteur de services. Il existe déjà un connecteur, que l’Assistant création d’application a créé pour vous.
Cochez la case en regard du connecteur, puis sélectionnez Modifier.
Sous l’onglet Informations de base, définissez Type de client sur Node.js.
Sélectionnez l’onglet Authentification.
Sélectionnez Stocker le secret dans Key Vault.
Sous Connexion du coffre de clés, sélectionnez Créer. Une boîte de dialogue Créer une connexion est ouverte en haut de la boîte de dialogue d’édition.

Étape 5 : dans la boîte de dialogue Créer une connexion pour la connexion du coffre de clés :

Dans Coffre de clés, sélectionnez le coffre de clés que vous avez créé précédemment.
Sélectionnez Vérifier + créer. Vous devriez voir que l’identité managée attribuée au système est définie sur Sélectionnée.
Lorsque la validation terminée, sélectionnez Créer.

Étape 6 : Vous revenez dans la boîte de dialogue d’édition pour defaultConnector.

Sous l’onglet Authentification, attendez que le connecteur de coffre de clés soit créé. Une fois l’opération terminée, la liste déroulante Connexion Key Vault effectue automatiquement la sélection.
Sélectionnez Suivant : Réseau.
Sélectionnez Configurer des règles de pare-feu pour activer l’accès au service cible. Si vous voyez le message « Aucun point de terminaison privé sur le service cible », ignorez-le. L’Assistant création d’application a déjà sécurisé la base de données Cosmos DB avec un point de terminaison privé.
Cliquez sur Enregistrer. Attendez que la notification Mise à jour réussie s’affiche.

Étape 7 : Vérifier vos modifications :

À partir du menu de gauche, sélectionnez Variables d’environnement de nouveau.
À côté de AZURE_COSMOS_CONNECTIONSTRING, sélectionnez Afficher la valeur. La valeur doit être @Microsoft.KeyVault(...), ce qui signifie qu’il s’agit d’une référence coffre de clés, car le secret est maintenant managé dans le coffre de clés.

Vous rencontrez des problèmes ? Examinez la section Résolution des problèmes.

4. Déployer l’exemple de code

Dans cette étape, vous configurez le déploiement GitHub avec GitHub Actions. Cette méthode fait partie des nombreuses façons de déployer sur App Service, mais elle permet également de bénéficier d’une intégration continue dans votre processus de déploiement. Par défaut, chaque git push vers votre référentiel GitHub lance l’action de build et de déploiement.

Étape 1 : Dans le menu de gauche, sélectionnez Déploiement>Centre de déploiement.

Étape 2 : Dans la page Centre de déploiement :

Dans Source, sélectionnez GitHub. Par défaut, GitHub Actions est sélectionné en tant que fournisseur de build.
Connectez-vous à votre compte GitHub et suivez l’invite pour autoriser Azure.
Dans Organisation, sélectionnez votre compte.
Dans Référentiel, sélectionnez msdocs-nodejs-mongodb-azure-sample-app.
Dans Branche, sélectionnez starter-no-infra. Il s’agit de la même branche que celle dans laquelle vous avez travaillé avec votre exemple d’application, sans fichiers ou configuration liés à Azure.
Pour le Type d’authentification, sélectionnez Identité affectée par l’utilisateur.
Dans le menu principal, sélectionnez Enregistrer. App Service valide un fichier de flux de travail dans le référentiel GitHub choisi, au sein du répertoire .github/workflows. Par défaut, le centre de déploiement crée une identité affectée par l’utilisateur pour que le flux de travail s’authentifie à l’aide de Microsoft Entra (authentification OIDC). Pour des options d’authentification alternatives, consultez Déployer sur App Service à l’aide de GitHub Actions.

Étape 3 : De retour dans le codespace GitHub de votre exemple de duplication, exécutez git pull origin starter-no-infra. Cela extrait le fichier de workflow nouvellement validé dans votre espace de code.

Étape 4 (Option 1 : avec GitHub Copilot) :

Démarrez une nouvelle session de conversation en sélectionnant la vue Conversation, puis en sélectionnant +.
Demandez « @workspace Comment l’application se connecte-t-elle à la base de données ? » Copilot peut vous diriger vers le fichier app.js et l’appel mongoose.connect.
Dites « *J’ai une variable de chaîne de connexion dans Azure appelée AZURE_COSMOS_CONNECTIONSTRING ». Copilot peut vous faire une suggestion de code similaire à celle présentée dans les étapes de l’Option 2 : sans GitHub Copilot ci-dessous, et même vous demander d’effectuer le changement dans app.js.
Ouvrez app.js dans l’Explorateur et ajoutez la suggestion de code dans la méthode getApp. GitHub Copilot ne vous donne pas la même réponse à chaque fois : il peut donc être nécessaire de poser d’autres questions pour affiner sa réponse. Pour obtenir des conseils, consultez Que puis-je faire avec GitHub Copilot dans mon codespace ?

Étape 4 (Option 2 : sans GitHub Copilot) :

À partir de l’explorateur, ouvrez app.js.
Recherchez la ligne où mongoose.connect est appelée (ligne 16) et remplacez process.env.MONGODB_URI par process.env.AZURE_COSMOS_CONNECTIONSTRING || process.env.MONGODB_URI.

Étape 5 :

Sélectionnez l’extension Contrôle de code source.
Dans la zone de texte, tapez un message de commit comme Update environment variable. Vous pouvez également sélectionner , puis laisser GitHub Copilot générer un message de commit à votre place.
Sélectionnez Valider, puis confirmez en choisissant Oui.
Sélectionnez Synchroniser les modifications 1, puis confirmez en choisissant OK.

Étape 6 : de retour dans la page Centre de déploiement du Portail Azure :

Sous l’onglet Journaux d’activité, sélectionnez Actualiser. Une nouvelle exécution de déploiement a déjà démarré à partir de vos modifications commitées.
Dans l’élément de journal de l’exécution du déploiement, sélectionnez l’entrée Générer/déployer des journaux avec l’horodatage le plus récent.

Étape 7 : Vous êtes dirigé vers votre référentiel GitHub où vous voyez que l’action GitHub est en cours d’exécution. Le fichier de workflow définit deux étapes distinctes : la build et le déploiement. Attendez que l’exécution de GitHub affiche l’état Terminé.

Vous rencontrez des problèmes ? Examinez la section Résolution des problèmes.

5. Accéder à l’application

Étape 1 : Dans la page App Service :

Dans le menu de gauche, sélectionnez Vue d’ensemble.
Sélectionnez l’URL de votre application. Vous pouvez également naviguer directement vers https://<app-name>.azurewebsites.net.

Étape 2 : Ajoutez quelques tâches à la liste. Félicitations ! Vous exécutez une application Node.js sécurisée et axée sur des données dans Azure App Service.

6. Diffuser les journaux de diagnostic

Azure App Service capture tous les messages consignés dans la console pour vous aider à diagnostiquer les problèmes liés à votre application. L’exemple d’application sort les messages du journal de la console dans chacun de ses points de terminaison pour illustrer cette capacité. Par exemple, le point de terminaison get génère un message sur le nombre de tâches récupérées dans la base de données et un message d’erreur s’affiche en cas de problème.

router.get('/', function(req, res, next) {
  Task.find()
    .then((tasks) => {      
      const currentTasks = tasks.filter(task => !task.completed);
      const completedTasks = tasks.filter(task => task.completed === true);

      console.log(`Total tasks: ${tasks.length}   Current tasks: ${currentTasks.length}    Completed tasks:  ${completedTasks.length}`)
      res.render('index', { currentTasks: currentTasks, completedTasks: completedTasks });
    })
    .catch((err) => {
      console.log(err);
      res.send('Sorry! Something went wrong.');
    });
});

Étape 1 : Dans la page App Service :

Dans le menu de gauche, sélectionnez Journaux App Service.
Sous Application Logging, sélectionnez Système de fichiers.
Dans le menu principal, sélectionnez Enregistrer.

Étape 2 : Dans le menu de gauche, sélectionnez Flux de journaux. Les journaux de votre application (notamment les journaux de plateforme et ceux issus de l’intérieur du conteneur) apparaissent.

7. Inspecter les fichiers déployés à l’aide de Kudu

Azure App Service fournit une console de diagnostic web nommée Kudu qui vous permet d’examiner l’environnement d’hébergement du serveur pour votre application web. Grâce à Kudu, vous pouvez visualiser les fichiers déployés sur Azure, passer en revue l’historique de déploiement de l’application et même ouvrir une session SSH dans l’environnement d’hébergement.

Étape 1 : Dans la page App Service :

Dans le menu de gauche, sélectionnez Outils avancés.
Sélectionnez Go. Vous pouvez également naviguer directement vers https://<app-name>.scm.azurewebsites.net.

Étape 2 : Sur la page Kudu, sélectionnez Déploiements.

Si vous déployez du code sur App Service à l’aide de Git ou de zip-deploy, un historique des déploiements de votre application web apparaît.

Étape 3 : Revenez sur la page d’accueil Kudu et sélectionnez Site wwwroot.

Vous pouvez voir la structure de dossiers déployée, puis effectuer une sélection afin de parcourir et afficher les fichiers.

8. Nettoyer les ressources

Lorsque vous avez terminé, vous pouvez supprimer toutes les ressources de votre abonnement Azure en supprimant le groupe de ressources.

Étape 1 : Dans la barre de recherche située en haut du Portail Microsoft Azure :

Entrez le nom du groupe de ressources.
Sélectionnez le groupe de ressources.

Étape 2 : Sur la page Groupe de ressources, sélectionnez Supprimer un groupe de ressources.

Étape 3 :

Entrer le nom du groupe de ressources pour confirmer la suppression.
Sélectionnez Supprimer.

2. Créer des ressources Azure et déployer un exemple d’application

Dans cette étape, vous allez créer les ressources Azure et déployer un exemple d’application dans App Service sur Linux. La procédure indiquée dans ce tutoriel permet de créer un ensemble de ressources sécurisées par défaut qui incluent App Service et Azure Cosmos DB.

Le conteneur de développement dispose déjà d’Azure Developer CLI (AZD).

Depuis la racine du référentiel, exécutez azd init.

azd init --template nodejs-app-service-cosmos-redis-infra

Lorsque vous y êtes invité, fournissez les réponses suivantes :

Question	Réponse
Le répertoire actif n’est pas vide. Voulez-vous initialiser un projet ici dans «<votre-répertoire>» ?	Y
Que souhaitez-vous faire de ces fichiers ?	Conserver mes fichiers existants inchangés
Entrer un nom pour le nouvel environnement	Tapez un nom unique. Le modèle AZD utilise ce nom dans le cadre du nom DNS de votre application web dans Azure (`<app-name>-<hash>.azurewebsites.net`). Les caractères alphanumériques et les traits d’union sont autorisés.

Connectez-vous à Azure en exécutant la commande azd auth login et en suivant l’invite :
```
azd auth login
```
Créez les ressources Azure nécessaires et déployer le code de l’application avec la commande azd up. Suivez l’invite pour sélectionner l’abonnement et l’emplacement souhaités pour les ressources Azure.
```
azd up
```
La commande azd up prend environ 15 minutes (le cache Redis prend le plus de temps). Il compile et déploie également le code de votre application, mais vous allez modifier votre code ultérieurement pour utiliser App Service. Pendant son exécution, la commande fournit des messages sur le processus d’approvisionnement et de déploiement, y compris un lien vers le déploiement dans Azure. Une fois l’opération terminée, la commande affiche également un lien vers l’application de déploiement.

Ce modèle AZD contient des fichiers (azure.yaml et le répertoire infra) qui génèrent une architecture sécurisée par défaut avec les ressources Azure suivantes :
- Groupe de ressources : conteneur pour toutes les ressources créées.
- Plan App Service : définit les ressources de calcul pour App Service. Un plan Linux est créé sur le niveau B1.
- App Service : représente votre application et s’exécute dans le plan App Service.
- Réseau virtuel : intégré à l’application App Service, isole le trafic réseau principal.
- Compte Azure Cosmos DB avec MongoDB API : accessible uniquement derrière son point de terminaison privé. Une base de données est créée pour vous sur le serveur.
- Azure Cache pour Redis : Accessible uniquement à partir du réseau virtuel.
- Coffre de clés : accessible uniquement derrière son point de terminaison privé. Permet de gérer les secrets de l’application App Service.
- Points de terminaison privés : points de terminaison d’accès pour le coffre de clés, le serveur de base de données et le cache Redis dans le réseau virtuel.
- Zones DNS privé : Activer la résolution DNS de la base de données Cosmos DB, du cache Redis et du coffre-fort dans le réseau virtuel.
- L’espace de travail Log Analytics : agit comme le conteneur cible de votre application pour expédier ses journaux d’activité, dans lequel vous pouvez également interroger les journaux.
Une fois que la commande a fini de créer les ressources et de déployer le code de l’application pour la première fois, l’exemple d’application déployé ne fonctionne pas encore, car vous devez apporter de petits changements pour qu’il se connecte à la base de données dans Azure.

3. Vérifier les chaînes de connexion

Le modèle AZD utilisé a généré les variables de connectivité pour vous en tant que paramètres d’application et les restitue sur le terminal pour plus de facilité. Les paramètres d’application sont un moyen de préserver les secrets de connexion hors de votre référentiel de code.

Dans la sortie AZD, retrouvez les paramètres de l’application AZURE_COSMOS_CONNECTIONSTRING. Seuls les noms des paramètres sont affichés. Ils ressemblent à ceci dans la sortie AZD :
```
 App Service app has the following app settings:
         - AZURE_COSMOS_CONNECTIONSTRING
         - AZURE_REDIS_CONNECTIONSTRING
         - AZURE_KEYVAULT_RESOURCEENDPOINT
         - AZURE_KEYVAULT_SCOPE
 
```
AZURE_COSMOS_CONNECTIONSTRING contient la chaîne de connexion à la base de données Cosmos DB dans Azure. Vous devez l’utiliser ultérieurement dans votre code.
Pour votre commodité, le modèle AZD affiche le lien direct vers la page des paramètres d’application de l’application. Recherchez le lien et ouvrez-le dans un nouvel onglet de navigateur.

Vous rencontrez des problèmes ? Examinez la section Résolution des problèmes.

4. Modifier l’exemple de code et effectuer au redéploiement

Avec GitHub Copilot
Sans GitHub Copilot

Dans le codespace GitHub, démarrez une nouvelle session de conversation en cliquant sur la vue Conversation, puis sur +.
Demandez « @workspace Comment l’application se connecte-t-elle à la base de données ? » Copilot peut vous diriger vers le fichier app.js et l’appel mongoose.connect.
Dites « *J’ai une variable de chaîne de connexion dans Azure appelée AZURE_COSMOS_CONNECTIONSTRING ». Copilot peut vous faire une suggestion de code similaire à celle présentée dans les étapes de l’Option 2 : sans GitHub Copilot ci-dessous, et même vous demander d’effectuer le changement dans app.js.
Ouvrez app.js dans l’Explorateur et ajoutez la suggestion de code dans la méthode getApp.

GitHub Copilot ne vous donne pas la même réponse à chaque fois : il peut donc être nécessaire de poser d’autres questions pour affiner sa réponse. Pour obtenir des conseils, consultez Que puis-je faire avec GitHub Copilot dans mon codespace ?
De retour dans le terminal codespace, exécutez azd deploy.
```
azd deploy
```

Dans l’Explorateur, ouvrez app.js et voyez l’application créer une connexion Mongoose à l’aide de MONGODB_URI (ligne 16).
Changez process.env.MONGODB_URI en process.env.AZURE_COSMOS_CONNECTIONSTRING || process.env.MONGODB_URI.

Cette modification permet de choisir la variable d’environnement appropriée pour la chaîne de connexion MongoDB, que l’exécution en cours soit locale ou dans Azure. Vous pouvez utiliser le même nom de variable pour les deux environnements, mais cela dépasse l’étendue du tutoriel.
De retour dans le terminal codespace, exécutez azd deploy.
```
azd deploy
```

Conseil

Vous pouvez également simplement utiliser azd up tout le temps, ce qui fait à la fois azd package, azd provision et azd deploy.

Vous rencontrez des problèmes ? Examinez la section Résolution des problèmes.

5. Accéder à l’application

Dans la sortie AZD, retrouvez l’URL de votre application et accédez-y dans le navigateur. L’URL ressemble à ceci dans la sortie AZD :
```
 Deploying services (azd deploy)

   (✓) Done: Deploying service web
   - Endpoint: https://<app-name>-<hash>.azurewebsites.net/
 
```
Ajoutez quelques tâches à la liste.

Félicitations, vous exécutez une application web dans Azure App Service, avec une connectivité sécurisée à Azure Cosmos DB.

Vous rencontrez des problèmes ? Examinez la section Résolution des problèmes.

6. Diffuser les journaux de diagnostic

router.get('/', function(req, res, next) {
  Task.find()
    .then((tasks) => {      
      const currentTasks = tasks.filter(task => !task.completed);
      const completedTasks = tasks.filter(task => task.completed === true);

      console.log(`Total tasks: ${tasks.length}   Current tasks: ${currentTasks.length}    Completed tasks:  ${completedTasks.length}`)
      res.render('index', { currentTasks: currentTasks, completedTasks: completedTasks });
    })
    .catch((err) => {
      console.log(err);
      res.send('Sorry! Something went wrong.');
    });
});

Dans la sortie AZD, retrouvez le lien pour diffuser en continu les journaux App Service et accédez-y dans le navigateur. Le lien ressemble à ceci dans la sortie AZD :

Stream App Service logs at: https://portal.azure.com/#@/resource/subscriptions/<subscription-guid>/resourceGroups/<group-name>/providers/Microsoft.Web/sites/<app-name>/logStream

En savoir plus sur la journalisation dans des applications Java dans des séries sur Activer Azure Monitor OpenTelemetry pour les applications .NET, Node.js, Java et Python.

Vous rencontrez des problèmes ? Examinez la section Résolution des problèmes.

7. Nettoyer les ressources

Pour supprimer toutes les ressources Azure dans le présent environnement de déploiement, exécutez azd down et suivez les invites.

azd down

Dépannage

Le portail de déploiement d’Azure Cosmos DB affiche un état de conflit
La page du navigateur de l’application déployée indique « Un problème s’est produit ».

Le portail de déploiement d’Azure Cosmos DB affiche un état de conflit

Selon votre abonnement et la région sélectionnée, vous pouvez voir que l’état du déploiement d’Azure Cosmos DB est Conflict ainsi que le message suivant dans les détails de l’opération :

Sorry, we are currently experiencing high demand in <region> region, and cannot fulfill your request at this time.

L’erreur est probablement due à une limite de votre abonnement pour la région que vous sélectionnez. Essayez de choisir une autre région pour votre déploiement.

La page du navigateur de l’application déployée indique « Un problème s’est produit ».

Vous devez probablement modifier la chaîne de connexion dans votre code d’application. Consultez 4. Déployer l’exemple de code.

Forum aux questions

Quel est le coût de cette configuration ?
Comment se connecter au serveur Azure Cosmos DB sécurisé derrière le réseau virtuel avec d’autres outils ?
Comment le développement d’applications locales fonctionne-t-il avec GitHub Actions ?
Pourquoi le déploiement GitHub Actions est-il si lent ?
Je n’ai pas les autorisations pour créer une identité affectée par l’utilisateur
Que puis-je faire avec GitHub Copilot dans mon codespace ?

Quel est le coût de cette configuration ?

Le prix des ressources créées est calculé comme suit :

Le plan App Service est créé au niveau De base. Il peut faire l’objet d’un scale-up ou d’un scale-down. Consultez la tarification App Service.
Le serveur Azure Cosmos DB est créé dans une seule région et peut être distribué dans d’autres régions (cf. Tarification d’Azure Cosmos DB).
Le réseau virtuel n’entraîne pas de frais, sauf si vous configurez des fonctionnalités supplémentaires, telles que le peering. Consultez Tarification du réseau virtuel Azure.
La zone DNS privée entraîne des frais minimes. Consultez la tarification d’Azure DNS.

Comment se connecter au serveur Azure Cosmos DB sécurisé derrière le réseau virtuel avec d’autres outils ?

Pour un accès de base à partir d’un outil en ligne de commande, vous pouvez exécuter mongosh à partir du terminal SSH de l’application. Le conteneur de l’application n’est pas équipé de mongosh. Vous devez donc l’installer manuellement. N’oubliez pas que le client installé ne persiste pas après redémarrage de l’application.
Pour vous connecter à partir d’un client GUI MongoDB, vous devez placer votre ordinateur dans le réseau virtuel. Par exemple, il peut s’agir d’une machine virtuelle Azure connectée à l’un des sous-réseaux ou d’une machine dans un réseau local disposant d’une connexion VPN de site à site avec le réseau virtuel Azure.
Si vous souhaitez vous connecter à partir de l’interpréteur de commandes MongoDB sur la page de gestion Azure Cosmos DB du portail, votre machine doit également se trouver dans le réseau virtuel. Vous pouvez sinon ouvrir le pare-feu du serveur Azure Cosmos DB pour l’adresse IP de votre ordinateur local, mais cela augmente la surface d’attaque de votre configuration.

Comment le développement d’applications locales fonctionne-t-il avec GitHub Actions ?

Prenez le fichier de workflow généré automatiquement à partir d’App Service comme exemple, chaque git push lance une nouvelle exécution de build et de déploiement. À partir d’un clone local du dépôt GitHub, vous faites en sorte que les mises à jour souhaitées le poussent vers GitHub. Par exemple :

git add .
git commit -m "<some-message>"
git push origin main

Pourquoi le déploiement GitHub Actions est-il si lent ?

Le fichier de workflow généré automatiquement à partir d’App Service divise l’exécution en deux tâches : la build et le déploiement. Étant donné que chaque tâche s’exécute dans son environnement propre, le fichier de workflow garantit que la tâche deploy a accès aux fichiers à partir de la tâche build :

À la fin de la tâche build, chargez les fichiers en tant qu’artefacts.
Au début de la tâche deploy, téléchargez les artefacts.

La majeure partie du temps pris par le processus à deux tâches est consacrée au chargement et au téléchargement des artefacts. Si vous le souhaitez, vous pouvez simplifier le fichier de workflow en combinant les deux travaux en un, ce qui élimine les étapes de chargement et de téléchargement.

Je n’ai pas les autorisations pour créer une identité affectée par l’utilisateur

Consultez Configurer le déploiement de GitHub Actions à partir du Centre de déploiement.

Que puis-je faire avec GitHub Copilot dans mon codespace ?

Vous pouvez peut-être remarquer que la vue de conversation GitHub Copilot était déjà là pour vous quand vous avez créé le codespace. Pour plus de commodité, nous incluons l’extension de conversation GitHub Copilot dans la définition du conteneur (consultez .devcontainer/devcontainer.json). Cependant, vous avez besoin d’un compte GitHub Copilot (essai gratuit de 30 jours disponible).

Quelques conseils à appliquer quand vous parlez à GitHub Copilot :

Dans une session de conversation unique, les questions et réponses s’appuient les unes sur les autres et vous pouvez ajuster vos questions pour affiner la réponse que vous obtenez.
Par défaut, GitHub Copilot n’a accès à aucun fichier de votre référentiel. Pour poser des questions sur un fichier, vous devez d’abord l’ouvrir dans l’éditeur.
Pour permettre à GitHub Copilot d’accéder à tous les fichiers du référentiel lors de la préparation de ses réponses, commencez votre question par @workspace. Pour plus d’informations, consultez Use the @workspace agent.
Dans la session de conversation, GitHub Copilot peut suggérer des modifications et même (avec @workspace) où apporter les modifications, mais il n’est pas autorisé à apporter les modifications pour vous. C’est à vous d’ajouter les changements suggérés et de les tester.

Voici d’autres choses que vous pouvez dire pour affiner la réponse que vous obtenez :

@workspace Où est défini MONGODB_URI ?
Dans quel fichier puis-je apporter la modification ?
Cette modification va-t-elle interrompre mon application lors de l’exécution locale ?

Étapes suivantes

Centre de développement pour JavaScript sur Azure

Configurer une application Node.js dans App Service

Sécuriser à l’aide d’un domaine personnalisé et d’un certificat

Partager via

Tutoriel : Déployer une application web Node.js + MongoDB sur Azure

Prérequis

1. Exécution de l'exemple

2. Créer App Service et Azure Cosmos DB

3. Secrets de la connexion sécurisée

4. Déployer l’exemple de code

5. Accéder à l’application

6. Diffuser les journaux de diagnostic

7. Inspecter les fichiers déployés à l’aide de Kudu

8. Nettoyer les ressources

2. Créer des ressources Azure et déployer un exemple d’application

3. Vérifier les chaînes de connexion

4. Modifier l’exemple de code et effectuer au redéploiement

5. Accéder à l’application

6. Diffuser les journaux de diagnostic

7. Nettoyer les ressources

Dépannage

Le portail de déploiement d’Azure Cosmos DB affiche un état de conflit

La page du navigateur de l’application déployée indique « Un problème s’est produit ».

Forum aux questions

Quel est le coût de cette configuration ?

Comment se connecter au serveur Azure Cosmos DB sécurisé derrière le réseau virtuel avec d’autres outils ?

Comment le développement d’applications locales fonctionne-t-il avec GitHub Actions ?

Pourquoi le déploiement GitHub Actions est-il si lent ?

Je n’ai pas les autorisations pour créer une identité affectée par l’utilisateur

Que puis-je faire avec GitHub Copilot dans mon codespace ?

Étapes suivantes

Commentaires

Ressources supplémentaires

Partager via

Tutoriel : Déployer une application web Node.js + MongoDB sur Azure

Prérequis

Passer à la fin

1. Exécution de l'exemple

2. Créer App Service et Azure Cosmos DB

3. Secrets de la connexion sécurisée

4. Déployer l’exemple de code

5. Accéder à l’application

6. Diffuser les journaux de diagnostic

7. Inspecter les fichiers déployés à l’aide de Kudu

8. Nettoyer les ressources

2. Créer des ressources Azure et déployer un exemple d’application

3. Vérifier les chaînes de connexion

4. Modifier l’exemple de code et effectuer au redéploiement

5. Accéder à l’application

6. Diffuser les journaux de diagnostic

7. Nettoyer les ressources

Dépannage

Le portail de déploiement d’Azure Cosmos DB affiche un état de conflit

La page du navigateur de l’application déployée indique « Un problème s’est produit ».

Forum aux questions

Quel est le coût de cette configuration ?

Comment se connecter au serveur Azure Cosmos DB sécurisé derrière le réseau virtuel avec d’autres outils ?

Comment le développement d’applications locales fonctionne-t-il avec GitHub Actions ?

Pourquoi le déploiement GitHub Actions est-il si lent ?

Je n’ai pas les autorisations pour créer une identité affectée par l’utilisateur

Que puis-je faire avec GitHub Copilot dans mon codespace ?

Étapes suivantes

Commentaires

Ressources supplémentaires