I denna handledning visar jag dig hur du implementerar en realtidschattprogram med Node.js, Socket.IO och MongoDB, och sedan distribuerar vi programmet till modulen tillsammans.
Först och främst, låt mig visa dig det slutliga utseendet på ansökan som vi kommer att ha i slutet av artikeln.
Node.js kommer att vara kärnan i programmet, med Express som MVC, MongoDB för databasen och Socket.IO för realtidskommunikation. När vi är färdiga kommer vi att distribuera vår ansökan till Modulus. MongoDB-delen finns faktiskt i modulen.
Som du kan se är det här en mycket enkel app, men det täcker nästan allt för en webbapplikation. Det finns inget kanalsystem i den här applikationen, men du kan gaffla källkoden och implementera kanalmodulen för övning.
Jag ska försöka förklara de små delarna av projektet först och kombinera dem i slutet. Jag börjar från baksidan till framsidan. Så, låt oss börja med domänobjekten (MongoDB-modeller).
För databasabstraktion använder vi Mongoose. I det här projektet har vi bara en modell som heter Meddelande
. Den här meddelandemodellen innehåller bara text
, skapa datum
,och författare
. Det finns ingen modell för författaren som Användare
, eftersom vi inte fullt ut kommer att implementera ett användarregistrerings- / inloggningssystem. Det kommer att finnas en enkel smeknamnssökande sida, och detta smeknamn sparas i en cookie. Detta kommer att användas i Meddelande
modell som text i författare
fält. Du kan se ett exempel på JSON-modellen nedan:
text: "Hej, finns det någon Full Stack Developer här?" författare: "john_the_full_stack", createDate: "2015.05.15"
För att skapa sådana dokument kan du implementera en modell med hjälp av Mongoose-funktionerna nedan:
var mongoose = kräver ('mongoose') var Message = new mongoose.Schema (författare: String, meddelande: String, createDate: typ: Date, default: Date.now); mongoose.model ("Meddelande", Meddelande)
Importera bara Mongoose-modulen, definiera din modell med dess fält och fältattribut i JSON-format och skapa en modell med namnet Meddelande
. Denna modell kommer att ingå i de sidor du vill använda.
Kanske har du en fråga om varför vi lagrar meddelandet i databasen, när vi redan sänder detta meddelande till användaren i samma kanal. Det är sant att du inte behöver lagra chattmeddelanden, men jag ville bara förklara databasintegrationsskiktet. Hur som helst, vi kommer att använda denna modell i vårt projekt inom kontrollerna. controllers?
Som jag sa tidigare kommer vi att använda Express för MVC-delen. Och C
här står för Kontrollant
. För våra projekt kommer det bara att finnas två slutpunkter för meddelanden. En av dem är för att ladda upp senaste chattmeddelanden och den andra är för hantering av skickade chattmeddelanden för att lagras i databasen och sedan sändas in i kanalen.
... app.get ('/ chat', funktion (req, res) res.sendFile (__ dirname + '/index.html');); app.get ('/ login', funktion (req, res) res.sendFile (__ dirname + '/login.html');); app.post ('/ messages', funktion (req, res, nästa) var message = req.body.message; var author = req.body.author; var messageModel = nytt meddelande (); messageModel.author = author; messageModel.message = message; messageModel.save (funktion (fel, resultat) if (! err) Message.find (). sort ('- createDate') .gräns (5) .exec (funktion meddelanden) io.emit ("message", messages);); res.send ("Message Sent!"); else res.send ("Tekniskt fel inträffade!"););); app.get ('/ messages', funktion (req, res, nästa) Message.find (). sort ('- createDate') .gräns (5) .exec (funktion (felmeddelanden) res. json (meddelanden););); ...
De första och andra kontrollerna är bara för att servera statiska HTML-filer för chatt- och inloggningssidorna. Den tredje är för hantering av postförfrågan till / messages
slutpunkt för att skapa nya meddelanden. I den här kontrollenheten konverteras först och främst begäranorganet till meddelandemodellen, och sedan sparas denna modell i databasen med hjälp av Mongoose-funktionen spara
.
Jag kommer inte att dyka in i Mongoose mycket - du kan titta på dokumentationen för ytterligare detaljer. Du kan ge en återuppringningsfunktion för sparafunktionen för att kontrollera om det finns något problem eller inte. Om det lyckas har vi hämtat de fem senaste dokumenten sorterade i fallande ordning av skapa datum
, och har sänt fem meddelanden till klienterna i kanalen.
Ok, vi är färdiga MC
.Låt oss byta till Se
del.
I allmänhet kan en mallmotor som Jade, EJS, Handlebars, etc. användas inom Express. Vi har dock bara en sida, och det är ett chattmeddelande, så jag ska betjäna detta statiskt. Egentligen, som jag sa ovan, finns det ytterligare två kontroller som tjänar denna statiska HTML-sida. Du kan se följande för att visa en statisk HTML-sida.
app.get ('/ chat', funktion (req, res) res.sendFile (__ dirname + '/index.html');); app.get ('/ login', funktion (req, res) res.sendFile (__ dirname + '/login.html'););
Denna ändpunkt tjänar bara index.html och login.html genom att använda res.sendFile
. Bådeindex.html och login.html finns i samma mapp som server.js, vilket är anledningen till att vi använde __dirname
före HTML-filnamnet.
På framsidan har jag använt Bootstrap och det är inte nödvändigt att förklara hur jag lyckades göra det. Jag har helt enkelt bundet en funktion till en textruta, och när du trycker på Stiga på nyckel eller Skicka knappen kommer meddelandet att skickas till back-end-tjänsten.
Den här sidan har också en obligatorisk js-fil av Socket.IO för att lyssna på den kanal som heter meddelande
. Socket.IO-modulen importeras redan i bakre änden, och när du använder den här modulen på serverns sida läggs den automatiskt till en slutpunkt för att servera Socket.IO js-filen, men vi använder den som serveras från cdn . När ett nytt meddelande kommer in i den här kanalen upptäcks det automatiskt och meddelandelistan uppdateras med de fem senaste meddelandena.
Det finns ytterligare en check i ovanstående kod: kakdelen. Om du inte har valt något smeknamn för chatt betyder det att cookien inte är inställd för smeknamnet, och du kommer automatiskt att omdirigeras till inloggningssidan.
Om inte, hämtas de senaste fem meddelandena via ett enkelt Ajax-samtal till / messages
slutpunkt. På samma sätt, när du klickar på Skicka knappen eller tryck på Stiga på tangent, kommer textmeddelandet hämtas från textrutan och smeknamnet hämtas från kakan och värdena skickas till servern med en postförfrågan. Det finns ingen strikt kontroll för smeknamnet här, eftersom jag ville fokusera på realtidsdelen, inte användarautentiseringsdelen.
Som du kan se är projektets övergripande struktur väldigt enkel. Låt oss komma till installationsdelen. Som jag sa tidigare kommer vi att använda Modulus, en av de bästa PaaSna för att distribuera, skala och övervaka din ansökan på ditt eget språk.
Det första som jag tänker är att visa dig hur du ska distribuera, men för en framgångsrik implementering behöver vi en arbetsdatabas. Låt oss ta en titt på hur man skapar en databas på modulen och utför sedan implementering.
Gå till modulens instrumentpanel efter att ha skapat ett konto. Klicka på databaser menyn till vänster och klicka Skapa databas.
Fyll i de obligatoriska fälten i popup-formuläret enligt nedan.
När du fyller i de obligatoriska fälten och klickar på Skapa, Det kommer att skapa en MongoDB-databas för dig, och du kommer att se din databasadress på skärmen. Vi kommer använda MONGO URI,så kopiera den URI.
I vårt projekt hämtas Mongo URI från miljövariabeln MONGO_URI
, och du måste ställa in den här miljövariabeln i instrumentpanelen. Gå till instrumentpanelen, klicka på projekt meny, välj ditt projekt i listan och klicka på Administrering i vänstra menyn. På den här sidan ser du avsnittet om miljövariabler när du rullar ner sidan, som visas nedan.
Du kan distribuera till modul på två sätt:
Jag kommer att fortsätta med kommandoradsalternativet, eftersom den andra är lätt att göra. Först och främst, installera modul CLI:
npm install-g modulus
Gå till din projektmapp och utför följande kommando för att logga in på modulen.
modul-inloggning
När du utför ovanstående kommando kommer du att bli ombedd att ange ett användarnamn och lösenord:
Om du har skapat ett konto med hjälp av GitHub kan du använda --github
alternativ.
modul inloggning - gubbar
Nu är du inloggad på Modulus, och det är dags att skapa ett projekt. Använd följande kommando för att skapa ett projekt:
modulprojekt skapa "Realtime Chat"
När du kör den här funktionen kommer du att bli ombedd för körtiden. Välj det första alternativet, vilket är Node.js, och för det andra kommer du att bli ombedd för servostorleken, och du kan behålla den som standard.
Vi har skapat ett projekt, och den här gången kommer vi att distribuera vårt nuvarande projekt till Modulus. Utför följande kommando för att skicka det aktuella projektet till Realtidschatt projekt på Modulus sidan.
modulutnyttjande
Det kommer att distribuera ditt projekt och du kommer att få din löpande projektadress vid slutet av det framgångsrika installationsmeddelandet:
Realtime Chat körs på realtime-chat-46792.onmodulus.net
Som du kan se är utplaceringen till modulen väldigt lätt!
Modulus CLI har mycket hjälpsamma kommandon att använda under projektets implementering eller vid körning. Till exempel, för att svansen loggar av ditt löpande projekt, kan du använda modulprojektloggar svans
, att skapa en MongoDB databasanvändning modulus mongo skapa
, för att ange en miljövariabel användning modul env set
, etc. Du kan se en fullständig lista med kommandon med hjälp av modulhjälp.
Huvudsyftet med denna handledning var att visa dig hur man skapar ett realtidschattprogram med Node.js, Socket.IO och MongoDB. För att driva ett projekt i produktion används Modulus som PaaS-leverantör. Modulus har väldigt enkla steg för implementering, och det har också en intern databas (MongoDB) för våra projekt. Utöver detta kan du använda väldigt hjälpsamma verktyg inom modulens instrumentpanel som Loggar, Meddelanden, Automatisk skalering, Databasadministration och så vidare.
För att registrera dig för Modulus klicka här och få extra $ 10 uteslutande för att vara en Tuts + -läsare. Använd kampanjkod ModulusChat10.
För mer information om Modulus företag erbjudande klicka här.