Een Node.js-chattoepassing bouwen met Socket.IO in een Azure-cloudservice (klassiek)

Socket.IO biedt realtime communicatie tussen uw Node.js server en clients. In deze zelfstudie leert u hoe u een socket host. Op IO gebaseerde chattoepassing op Azure. Zie socket.io voor meer informatie over Socket.IO.

Hieronder ziet u een schermopname van de voltooide toepassing:

! [Een browservenster met de service die wordt gehost op Azure] [completed-app]

Vereisten

Zorg ervoor dat de volgende producten en versies zijn geïnstalleerd om het voorbeeld in dit artikel te voltooien:

• Visual Studio installeren
• Node.js installeren
• Python-versie 2.7.10 installeren

Een cloudserviceproject maken

Met de volgende stappen maakt u het cloudserviceproject dat als host fungeert voor de Socket.IO-toepassing.

1. Zoek in het startmenu of het startschermnaar Windows PowerShell. Klik ten slotte met de rechtermuisknop op Windows PowerShell en selecteer Als administrator uitvoeren.

   

2. Maak een map met de naam c:\node.

   PS C:\> md node
   

3. Directory's wijzigen in de map c:\node

   PS C:\> cd node
   

4. Voer de volgende opdrachten in om een nieuwe oplossing met de naam chatapp en een werkrol met de naam WorkerRole1te maken:

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

   U ziet het volgende antwoord:

   

Het chatvoorbeeld downloaden

Voor dit project gebruiken we het chatvoorbeeld uit de [Socket.IO GitHub-opslagplaats]. Voer de volgende stappen uit om het voorbeeld te downloaden en toe te voegen aan het project dat u eerder hebt gemaakt.

1. Maak een lokale kopie van de opslagplaats met behulp van de knop Klonen . U kunt ook de zip-knop gebruiken om het project te downloaden.

   

2. Navigeer door de mapstructuur van de lokale opslagplaats totdat u bij de map examples\chat aankomt. Kopieer de inhoud van deze map naar de map C:\node\chatapp\WorkerRole1 die u eerder hebt gemaakt.

   

   De gemarkeerde items in de bovenstaande schermafbeelding zijn de bestanden die zijn gekopieerd uit de map examples\chat

3. Verwijder in de map C:\node\chatapp\WorkerRole1 het server.js-bestand en wijzig de naam van hetapp.js-bestand in server.js. Hiermee verwijdert u het standaardbestandserver.js dat u eerder hebt gemaakt met de cmdlet Add-AzureNodeWorkerRole en vervangt deze door het toepassingsbestand uit het chatvoorbeeld.

Server.js wijzigen en modules installeren

Voordat u de toepassing in de Azure-emulator test, moeten we enkele kleine wijzigingen aanbrengen. Voer de volgende stappen uit voor het server.js-bestand:

1. Open het server.js-bestand in Visual Studio of een teksteditor.

2. Zoek de sectie Moduleafhankelijkheden aan het begin van server.js en wijzig de regel met sio = require('.. //.. lib//socket.io') naar sio = require('socket.io') zoals hieronder wordt weergegeven:

   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. Om ervoor te zorgen dat de toepassing op de juiste poort luistert, opent u server.js in Kladblok of uw favoriete editor en wijzigt u vervolgens de volgende regel door 3000 te vervangen door process.env.port , zoals hieronder wordt weergegeven:

   //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);
   });
   

Nadat u de wijzigingen in server.jshebt opgeslagen, gebruikt u de volgende stappen om de vereiste modules te installeren en test u vervolgens de toepassing in de Azure-emulator:

1. Gebruik Azure PowerShell om mappen te wijzigen in de map C:\node\chatapp\WorkerRole1 en gebruik de volgende opdracht om de modules te installeren die vereist zijn voor deze toepassing:

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

   Hiermee worden de modules geïnstalleerd die worden vermeld in het bestand package.json. Wanneer de opdracht is voltooid, ziet de uitvoer er als volgt uit:

   

2. Omdat dit voorbeeld oorspronkelijk deel uitmaakt van de Socket.IO GitHub-opslagplaats en rechtstreeks naar de Socket.IO-bibliotheek verwijst per relatief pad, wordt er niet naar Socket.IO verwezen in het bestand package.json. Daarom moeten we het installeren door de volgende opdracht uit te geven:

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

Testen en implementeren

1. Start de emulator door de volgende opdracht uit te geven:

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

   Notitie

   Als u problemen ondervindt met het starten van de emulator, bijvoorbeeld: Start-AzureEmulator: er is een onverwachte fout opgetreden. Details: Er is een onverwachte fout opgetreden Het communicatieobject System.ServiceModel.Channels.ServiceChannel kan niet worden gebruikt voor communicatie omdat het de status Fout heeft.

   Installeer AzureAuthoringTools v 2.7.1 en AzureComputeEmulator v 2.7 opnieuw. Zorg ervoor dat de versie overeenkomt.

2. Open een browser en ga naar http://127.0.0.1.

3. Wanneer het browservenster wordt geopend, voert u een bijnaam in en drukt u op Enter. Hiermee kunt u berichten posten als een specifieke bijnaam. Als u de functionaliteit van meerdere gebruikers wilt testen, opent u extra browservensters met dezelfde URL en voert u verschillende bijnamen in.

   

4. Nadat u de toepassing hebt getest, stopt u de emulator door de volgende opdracht uit te geven:

   PS C:\node\chatapp\WorkerRole1> Stop-AzureEmulator
   

5. Gebruik de cmdlet Publish-AzureServiceProject om de toepassing in Azure te implementeren. Bijvoorbeeld:

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

   Belangrijk

   Zorg ervoor dat u een unieke naam gebruikt, anders mislukt het publicatieproces. Nadat de implementatie is voltooid, wordt de browser geopend en gaat u naar de geïmplementeerde service.

   Als u een foutbericht krijgt met de mededeling dat de opgegeven abonnementsnaam niet bestaat in het geïmporteerde publicatieprofiel, moet u het publicatieprofiel voor uw abonnement downloaden en importeren voordat u implementeert in Azure. Zie de sectie De toepassing implementeren in Azure van Een Node.js-toepassing bouwen en implementeren in een Azure-cloudservice

   ! [Een browservenster met de service die wordt gehost op Azure] [completed-app]

   Notitie

   Als u een foutbericht krijgt met de mededeling dat de opgegeven abonnementsnaam niet bestaat in het geïmporteerde publicatieprofiel, moet u het publicatieprofiel voor uw abonnement downloaden en importeren voordat u implementeert in Azure. Zie de sectie De toepassing implementeren in Azure van Een Node.js-toepassing bouwen en implementeren in een Azure-cloudservice

Uw toepassing wordt nu uitgevoerd in Azure en kan chatberichten doorgeven tussen verschillende clients met behulp van Socket.IO.

Volgende stappen

In deze zelfstudie hebt u geleerd hoe u een eenvoudige chattoepassing maakt die wordt gehost in een Azure-cloudservice. Zie Een Node.js-chattoepassing bouwen met Socket.IO op een Azure-website voor meer informatie over het hosten van deze toepassing op een Azure-website.

Zie ook het Node.js Developer Center voor meer informatie.