Partager via


Création d’une application de conversation instantanée Node.js avec Socket.IO sur un service cloud Azure (classique)

Conseil / Astuce

Socket.IO est désormais pris en charge de manière native sur Azure. Effectuer le scale-out d’une application Socket.IO, pour gérer des milliers de connexions, est souvent frustrant. Azure prenant désormais en charge Socket.IO en mode natif, vous pouvez laisser Azure gérer la scalabilité et la disponibilité. En savoir plus sur le moyen d’obtenir n’importe quelle application Socket.IO s’exécutant sur Azure avec quelques lignes de code.

Important

Cloud Services (classique) est désormais déconseillé pour tous les clients depuis le 1er septembre 2024. Depuis octobre 2024, tous les déploiements en cours d’exécution ont été arrêtés par Microsoft et les données ont été définitivement perdues. Les nouveaux déploiements doivent utiliser le nouveau modèle de déploiement basé sur Azure Resource Manager Azure Cloud Services (support étendu) .

Socket.IO permet une communication en temps réel entre votre serveur Node.js et vos clients. Ce didacticiel présente l’hébergement d’une application de conversation instantanée Socket.IO dans Azure. Pour plus d’informations sur Socket.IO, consultez socket.io.

La capture d’écran suivante présente l’application terminée :

![Fenêtre de navigateur affichant le service hébergé sur Azure[completed-app]]

Conditions préalables

Assurez-vous que les versions et les produits suivants sont installés pour mener à bien l'exemple dans cet article :

Création d'un projet de service cloud

Les étapes suivantes créent le projet de service cloud qui héberge l’application Socket.IO.

  1. À partir du menu Démarrer ou de l’écran d’accueil, recherchez Windows PowerShell. Enfin, cliquez avec le bouton droit sur Windows PowerShell et sélectionnez Exécuter en tant qu’administrateur.

    Icône Azure PowerShell

  2. Créez un répertoire appelé c:\node.

    PS C:\> md node
    
  3. Remplacez les répertoires par le répertoire c:\node.

    PS C:\> cd node
    
  4. Entrez les commandes suivantes pour créer une solution nommée chatapp et un rôle de travail nommé WorkerRole1 :

    PS C:\node> New-AzureServiceProject chatapp
    PS C:\Node> Add-AzureNodeWorkerRole
    

    Vous obtenez la réponse suivante :

    Résultat des cmdlets new-azureservice et add-azurenodeworkerrole

Téléchargement de l'exemple de conversation instantanée

Pour ce projet, nous utilisons un exemple de conversation instantanée obtenu depuis le [référentiel GitHub Socket.IO]. Procédez comme suit pour télécharger l'exemple et l'ajouter au projet créé précédemment.

  1. Créez une copie locale du référentiel en utilisant le bouton Clone . Vous pouvez aussi télécharger le projet en utilisant le bouton ZIP .

    Une fenêtre de navigateur avec https://github.com/LearnBoost/socket.io/tree/master/examples/chat, avec l’icône de téléchargement ZIP mis en évidence

  2. Accédez à la structure de répertoires du référentiel local, jusqu’à atteindre le répertoire examples\chat. Copiez le contenu de ce répertoire dans le répertoire C:\node\chatapp\WorkerRole1 créé précédemment.

    Explorateur affichant le contenu du répertoire de conversations/exemples extrait de l’archive

    Les éléments mis en évidence sur la capture d’écran précédente sont les fichiers copiés depuis le répertoire examples\chat

  3. Dans le répertoire C:\node\chatapp\WorkerRole1, supprimez le fichier server.js, puis renommez le fichier app.js en server.js. Cette étape supprime le fichier server.js par défaut créé précédemment par la cmdlet Add-AzureNodeWorkerRole et le remplace par le fichier d’application de l’exemple de conversation.

Modification du fichier Server.js et installation des modules

Avant de tester l'application dans l'émulateur Azure, nous allons apporter quelques modifications mineures. Procédez comme suit avec le fichier server.js :

  1. Ouvrez le fichier server.js dans Visual Studio ou un éditeur de texte.

  2. Recherchez la section Dépendances de module située au début du fichier server.js, puis remplacez la ligne contenant sio = require('..//..//lib//socket.io') par sio = require('socket.io'), comme suit :

    var express = require('express')
      , stylus = require('stylus')
      , nib = require('nib')
    //, sio = require('..//..//lib//socket.io'); //Original
      , sio = require('socket.io');                //Updated
      var port = process.env.PORT || 3000;         //Updated
    
  3. Pour vous assurer que l’application écoute le port approprié, ouvrez server.js dans le Bloc-notes ou votre éditeur favori, puis modifiez la ligne suivante en remplaçant 3000 par process.env.port comme suit :

    //app.listen(3000, function () {            //Original
    app.listen(process.env.port, function () {  //Updated
      var addr = app.address();
      console.log('   app listening on http://' + addr.address + ':' + addr.port);
    });
    

Après avoir enregistré vos modifications dans le fichier server.js, procédez comme suit pour installer les modules requis, puis testez l'application dans l'émulateur Azure :

  1. Dans Azure PowerShell, remplacez les répertoires par le répertoire C:\node\chatapp\WorkerRole1 et utilisez la commande suivante pour installer les modules requis par cette application :

    PS C:\node\chatapp\WorkerRole1> npm install
    

    Cette commande installe les modules répertoriés dans le fichier package.json. Une fois la commande terminée, la sortie doit ressembler à la capture d’écran suivante :

    Résultat de la commande npm install

  2. Cet exemple faisant partie du référentiel GitHub Socket.IO et étant directement référencé par la bibliothèque Socket.IO par un chemin d'accès relatif, Socket.IO n'a pas été référencée dans le fichier package.json. Vous devez donc l'installer en exécutant la commande suivante :

    PS C:\node\chatapp\WorkerRole1> npm install socket.io --save
    

Test et déploiement

  1. Démarrez l'émulateur en exécutant la commande suivante :

    PS C:\node\chatapp\WorkerRole1> Start-AzureEmulator -Launch
    

    Remarque

    Si vous rencontrez des problèmes pour le lancement de l’émulateur, par ex. : Start-AzureEmulator : une erreur inattendue est survenue. Détails : Une erreur inattendue a été rencontrée. L’objet de communication System.ServiceModel.Channels.ServiceChannel ne peut pas être utilisé pour la communication, car son état est Faulted.

    Réinstallez AzureAuthoringTools v 2.7.1 et AzureComputeEmulator v 2.7 : assurez-vous que la version correspond.

  2. Ouvrez un navigateur et accédez à http://127.0.0.1.

  3. À l'ouverture de la fenêtre du navigateur, entrez un pseudonyme, puis appuyez sur Entrée. Cette étape vous permet de publier des messages sous un pseudonyme spécifique. Pour tester la fonctionnalité multi-utilisateurs, ouvrez plus de fenêtres de navigateur en utilisant la même URL et en entrant différents pseudonymes.

    Deux fenêtres du navigateur affichant des messages de conversation instantanée des utilisateurs User1 et User2

  4. Une fois le test de l'application terminé, arrêtez l'émulateur en exécutant la commande suivante :

    PS C:\node\chatapp\WorkerRole1> Stop-AzureEmulator
    
  5. Pour déployer l'application dans Azure, utilisez la cmdlet Publish-AzureServiceProject . Par exemple:

    PS C:\node\chatapp\WorkerRole1> Publish-AzureServiceProject -ServiceName mychatapp -Location "East US" -Launch
    

    Important

    Veillez à utiliser un nom unique, sans quoi le processus de publication échoue. Une fois le déploiement terminé, le navigateur s'ouvre et accède au service déployé.

    Si vous recevez une erreur indiquant que le nom d’abonnement fourni n’existe pas dans le profil de publication importé, vous devez télécharger et importer le profil de publication de votre abonnement avant de le déployer dans Azure. Consultez la section Déploiement de l'application dans Azure du didacticiel Création et déploiement d'une application Node.js dans Azure Cloud Services

    ![Fenêtre de navigateur affichant le service hébergé sur Azure[completed-app]]

    Remarque

    Si vous recevez une erreur indiquant que le nom d’abonnement fourni n’existe pas dans le profil de publication importé, vous devez télécharger et importer le profil de publication de votre abonnement avant de le déployer dans Azure. Consultez la section Déploiement de l'application dans Azure du didacticiel Création et déploiement d'une application Node.js dans Azure Cloud Services

Votre application s'exécute à présent dans Azure, et peut transmettre des messages de conversation instantanée entre différents clients en utilisant Socket.IO.

Remarque

Par souci de simplification, cet exemple présente simplement une conversation instantanée entre des utilisateurs connectés à la même instance. Cela veut dire que si le service cloud crée deux instances de rôle de travail, un utilisateur pourra utiliser la conversation instantanée pour communiquer uniquement avec les autres utilisateurs connectés à la même instance de rôle de travail. Pour mettre à l'échelle l'application afin d'utiliser plusieurs instances de rôle, vous pouvez utiliser une technologie telle que Service Bus pour partager l'état de stockage Socket.IO entre plusieurs instances. Pour en savoir plus, consultez les exemples d’utilisation des files d’attente et rubriques de Service Bus dans le référentiel GitHub Kit de développement logiciel (SDK) Azure pour Node.js.

Étapes suivantes

Dans ce didacticiel vous avez appris à créer une application de conversation instantanée de base, hébergée dans un service cloud Azure. Pour plus d’informations sur l’hébergement de cette application sur un site web Azure, consultez la page Création d’une application de conversation instantanée Node.js avec Socket.IO sur un site web Azure.

Pour plus d'informations, consultez aussi le Centre pour développeurs Node.js.