Websocket med Node.js

Webapplikationer har ændret sig og udviklet sig, hvilket gør brugernes behov anderledes end da den første forbindelsesprotokol blev oprettet på netværket. Derfor protokollen HTTP har udviklet sig gennem årene, men endnu ikke har nået et realtidsniveau såsom en forbindelse TCP mellem to hold.
Disse begrænsninger, frem for at skade udviklere og brugere, er blevet en kilde til motivation og kreativitet og skaber løsninger, der tillader os ikke kun at efterligne et transmissionssystem i realtid, men også gennem HTTP gør det næsten indfødt.
WebsocketDet er her Websocket, en relativt ny protokol, der kun understøttes af de mest moderne browsere, som giver os mulighed for at fjerne HTTP for alle dens begrænsninger og dermed være i stand til at kommunikere effektivt gennem headers FÅ.
Websocket Det er stadig i en periode med aktiv modning, så det er meget muligt, at vi ikke finder det i nye løsninger, heldigvis i Node.js vi har allerede nogle værktøjer, der giver os mulighed for at håndtere dem uden at skulle stole på vores opfindsomhed for at bygge værktøjer på lavere niveau.
KravDette er en avanceret vejledning, så vi vil først kræve en funktionel installation af Node.js I vores system kan vi se på denne vejledning, før vi fortsætter med at fordybe os i den. Desuden skal vi have administratorrettigheder for at kunne installere de biblioteker, vi skal bruge. Vi skal kende begreberne JavaScript for eksempel ring tilbage og anonyme funktioner. Endelig skal vi have en teksteditor som Sublim tekst der giver os mulighed for at skrive de forskellige koder, der er i eksemplerne.
For at begynde at oprette et program, der giver os mulighed for at bruge Websockets Vi skal først bygge en lille struktur, dette er meget enkelt, men nødvendigt, denne struktur vil bestå af:
1- En mappe, hvor vi vil gemme filerne i vores projekt.
2- En fil med navnet server.js, denne fil, som navnet angiver, vil være den server, gennem hvilken vi skal etablere forbindelsen i realtid ved hjælp af Websockets.
3- En fil med navnet client.html, denne fil vil være grænsefladen til at kommunikere med vores server via browseren, er det nødvendigt at have den samme, så vi kan sende og modtage de tilsvarende oplysninger.
Da vi har vores struktur defineret nu, kan vi begynde at tage et par linjer kode, for dette skal vi starte med at installere et eksternt bibliotek kaldet ws i vores miljø, da dette er den, der giver os mulighed for at bruge den pågældende protokol. For at installere dette bibliotek skal vi bare åbne vores konsol Node.js, vi er placeret i den mappe, hvor vores filer vil være, og vi placerer følgende kommando:

 npm installer ws

Når vi udfører det, kan vi se følgende resultat i vores kommandokonsol:

Når vi har installeret biblioteket, kan vi fortsætte vores arbejde, nu i vores fil server.js Vi skal skrive følgende kode, lad os først se, hvad den består af, så forklarer vi den:

 var WSServer = require ('ws'). Server, wss = ny WSServer ({port: 8085}); wss.on ('forbindelse', funktion (socket) {socket.on ('meddelelse', funktion (msg) {console.log ('Modtaget:', msg, '\ n', 'Fra IP:', socket. upgradeReq.connection.remoteAddress); if (msg === 'Hello') {socket.send ('Yes it works!');}}); socket.on ('close', function (code, desc) {console .log ('Offline:' + kode + '-' + desc);});});

Det første, vi gør, er at kræve biblioteket ws at vi lige har installeret og straks i samme instruktion kalder din klasse Server, så opretter vi en forekomst, hvormed vi skal oprette en server, der kører på porten 8085Denne port kan være, hvad vi har adgang til. I dette tilfælde bruges 8085, så der ikke er konflikt med andre tjenester, der i øjeblikket er i dette testmiljø.
Da vi har defineret vores instans nu, vil vi anvende metoden.på () for forbindelsesbegivenheden, derefter i ring tilbage fra det passerer vi et objekt kaldet stikkontakt, med dette vil vi modtage beskederne fra klienten, og vi har skrevet en rutine om, at hvis vi modtager ordet "Hej" serveren returnerer en besked, hvor vi til gengæld også vil udskrive noget i kommandokonsollen. Endelig, hvis vi lukker forbindelsen, har vi kun en besked på konsollen.
Når vi har vores server, er det tid til at bygge vores klient, til den i filen client.html vi kommer til at definere en struktur, hvor vi skal placere html -tags og a JavaScript som vil fungere som et link til vores server. Lad os se, hvordan vores fil ser ud:

 Websockets Client Send

Den del HTML er ganske enkelt, har vi en teksttypeindgang og en knappen Send, samt en div kaldet output, der er, hvem der vil modtage oplysningerne fra serveren for at vise dem til brugeren. Det interessante kommer i etiketten, hvor det første, vi gør, er at oprette et objekt af typen WebSocket og vi angiver ruten, hvor du skal finde den, i vores tilfælde er det lokal vært: 8085 og så kan vi se, at det vi gjorde i server.js. Vi forbinder derefter vores sende-, tekst- og outputelementer med variabler, som vi kan bruge.
Så hvad vi gør er at definere hver af de metoder, vi kan modtage fra serveren, så hver gang vi sender noget, bliver det registreret i vores output, alt takket være metoden send (). Den anden metode, vi bruger, er onmessage () som kun aktiveres, hvis vores server reagerer, og vi tilføjer resultatet i vores HTML.
Endelig bruger vi metoderne onclose () Y onerror (), den første giver os en besked, når forbindelsen med Websocket stoppes eller lukkes, og den anden informerer os, hvis der er opstået en fejl. Med dette skal vi kun starte serveren i vores konsol og få vores eksempel til at fungere, til dette bruger vi følgende kommando:

 node server.js

Dette starter serveren, men for at verificere funktionaliteten af ​​vores kode skal vi eksekvere vores client.html -fil i vores foretrukne browser og skrive noget i tekstboksen og trykke på send -knappen, dette vil generere kommunikation med websocket og vi kan se svaret efter konsol:

På billedet kan vi se, hvordan kommandokonsollen udskriver den modtagne besked, selv registrerer IP -adressen, hvorfra den modtager dataene, det var det, vi programmerede i vores fil server.js, hvor vi også angav, at hvis vi modtog ordet "Hej", ville vi sende en svarmeddelelse, som er lige hvad vi ser i browservinduet i det samme billede. Hvis vi nu opdaterer browseren, er forbindelsen brudt, denne er også registreret af vores applikation, lad os se:

Endelig hvis vi lukker forbindelsen i vores konsol med CTRL + C For at stoppe serveren affyrer vores browser fejlhåndtereren, og der vil vi se en ny meddelelse:

Hvis vi har været observatører, har vi muligvis bemærket noget vigtigt, har vi på intet tidspunkt været nødt til at opdatere browseren eller foretage en anmodning for at modtage svar Ajax, alt har været tovejs direkte med WebSockets, det er det, der kaldes realtid.
Det, vi har vist, er en af ​​de mest rudimentære og manuelle måder, der findes, men det fungerer for os at vide, hvordan arbejdsgangen er, men den reelle funktionalitet klar til produktionsmiljøer opnås med biblioteket socket.io, dette gør det samme, som vi gjorde i selvstudiet, men i en meget mere kompakt og mindre tilbøjelig til fejl fra udvikleren, hvilket giver os mulighed for kun at fokusere på applikationens logik og ikke så meget på den tekniske del af det.
Til installation socket.io vi skal bare lave en npm installer socket.io og med dette fra depotet vil vi downloade den nyeste stabile version af biblioteket, som giver os mulighed for at starte vores udvikling.
Med dette har vi afsluttet denne vejledning, som vi har taget et vigtigt skridt inden for Node.js ved at vide, hvordan man bruger Websockets, bliver denne teknologi mere og mere vigtig for hver dag, da den hjælper os med at oprette applikationer, der aldrig var tænkt på på nettet. Det er også vigtigt, at vi dokumenterer os selv om protokollen, da det er en måde at forstå potentialet i, hvad vi kan opnå ved blot at udvikle applikationer.