WebSocket je integralna tehnologija u mnogim modernim web aplikacijama. Ako pišete kod za web, vjerojatno ste već čuli taj izraz, ali možda niste sigurni što je to točno ili kako ga koristiti. Na sreću, WebSocket nije složen koncept i možete ga vrlo brzo razumjeti.
Što je WebSocket?
WebSocket je, nažalost, jedan od onih naziva koji na prvi pogled nemaju smisla. WebSocket je zapravo ime a komunikacijski protokol koji omogućuje dvosmjernu komunikaciju između klijenta i web poslužitelja.
Jednostavnije rečeno, WebSocket je tehnologija koja omogućuje klijentu i poslužitelju stvaranje veze pri čemu bilo koja strana može drugoj poslati poruku u bilo kojem trenutku.
Ovo se razlikuje od obične HTTP veze, gdje klijent mora pokrenuti zahtjev, a tek tada poslužitelj može poslati odgovor. Zapravo, WebSocket je potpuno drugačiji komunikacijski protokol od HTTP-a koji je dizajniran da bude kompatibilan s HTTP-om. Kada klijentska aplikacija želi pokrenuti WebSocket vezu, mora koristiti HTTP mehanizam nadogradnje za prebacivanje na WebSocket protokol.
U ovom trenutku možda mislite: "protokol je samo skup pravila, kako to možete koristiti za kodiranje?".
Dio koji nedostaje je nešto što se zove a stog protokola. U osnovi, uređaji koji podržavaju protokol imaju hardver i softver ugrađen u njih koji vam omogućuju pisanje aplikacija koje komuniciraju pomoću protokola. Protokol se ne koristi izravno za izgradnju bilo čega.
Zašto je stvoren WebSocket?
Kako bismo ilustrirali potrebu za WebSocketom, razmotrimo mehanizam iza chata na internetu.
Netko šalje poruku poslužitelju za chat sa svog uređaja, ali poslužitelj ipak mora poslati tu poruku na vaš uređaj prije nego što je možete pročitati. Ako poslužitelj koristi HTTP, poslužitelj vam ne može izravno proslijediti tu poruku jer poslužitelj ne može pokrenuti zahtjeve.
Postoji nekoliko načina za rješavanje ovog problema s HTTP-om. Jedan od načina je da klijent stalno šalje zahtjeve za ažuriranje poslužitelju, a poslužitelj će proslijediti sve podatke koje ima u odgovoru. Ova tehnika se zove prozivanje, a svaki zahtjev se zove anketa. Postoje dvije varijante prozivanja: dugo prozivanje i kratko prozivanje.
Korištenje varijante dugog prozivanja znači da uređaj klijenta neprestano pita poslužitelja jesu li dostupne nove poruke. Ako su nove poruke dostupne, poslužitelj će poslati poruke kao odgovor. Ako ne, poslužitelj bi odgodio odgovor i držao otvorenu vezu sve dok ne bi imao podatke za slanje, a zatim bi klijent odmah poslao novi zahtjev.
Ova tehnika je neučinkovita, jer HTTP nije dizajniran da se koristi na ovaj način. Djeluje adekvatno u maloj mjeri, ali svaki HTTP zahtjev uključuje slanje dodatnih podataka u zaglavlje, a to rezultira značajno povećanim opterećenjem poslužitelja kada mnogi klijenti ispituju to.
Evo dijagrama koji ilustrira dugo glasanje:
Varijanta s kratkim prozivanjem još je manje učinkovita. U kratkom prozivanju, poslužitelj ne drži vezu otvorenom sve dok nema novih podataka, što znači da klijent mora nastaviti prozivati poslužitelj u fiksnim, vrlo kratkim intervalima.
Druga tehnika za dvosmjernu komunikaciju u HTTP-u naziva se strujanje.
U strujanju, nakon što je poslan prvi zahtjev, poslužitelj drži vezu otvorenom na neodređeno vrijeme, šaljući nove dijelove informacija kao kontinuirane djelomične odgovore klijentu.
Korištenje strujanja rezultira manjim opterećenjem podataka i opterećenjem poslužitelja nego anketiranje, jer u idealnom slučaju klijent postavlja samo jedan HTTP zahtjev. Nažalost, strujanje stvara probleme pod određenim uvjetima jer preglednici i mrežni posrednici (poput proxyja) često pokušavaju riješiti djelomični odgovori kao razbijeni dijelovi jednog velikog HTTP odgovora (što je normalno HTTP ponašanje), umjesto kao zasebne poruke kojima su namijenjeni biti.
WebSocket je stvoren za rješavanje ovih problema. Za razliku od HTTP-a, WebSocket je dizajniran posebno za dvosmjernu komunikaciju. Uz WebSocket, nakon što se veza otvori, klijent i poslužitelj mogu slati poruke naprijed-natrag bez problema s prozivanjem ili strujanjem.
Slučajevi korištenja za WebSocket
WebSocket je izvrstan, ali to ne znači da bi se trebao koristiti svugdje.
Implementacija WebSocketa može dodati složenost vašoj aplikaciji, posebno na strani poslužitelja, pa to ne bi trebalo raditi osim ako nemate dobar razlog. Postavlja se pitanje: kako izgleda dobar razlog?
WebSocket je idealan za slučajeve korištenja gdje je potrebna česta dvosmjerna komunikacija s niskom latencijom. Drugim riječima, WebSocket pruža prednost aplikacijama koje moraju komunicirati često ili u velikoj mjeri. Ako komunikacija ne mora biti u stvarnom vremenu ili aplikacija nikada neće narasti do velikih razmjera, anketiranje ili strujanje mogu biti dovoljni za upotrebu u toj aplikaciji.
Tipična uporaba WebSocketa je u izradi aplikacija za chat, online igrama za više igrača, suradnji u stvarnom vremenu i softveru za obavijesti itd.
Kako koristiti WebSocket na strani klijenta
Korištenje WebSocketa na strani poslužitelja može biti prilično zapleteno, a proces se značajno razlikuje ovisno o jeziku (kao C#, Java, itd.) i biblioteku po izboru, tako da ga ovdje nećemo pokrivati. Zatim ćemo ukratko raspraviti kako koristiti WebSocket na strani klijenta.
Svi moderni preglednici implementiraju web API pod nazivom WebSocket API, što je hrpa protokola preglednika za WebSocket protokol. Možete koristiti WebSocket u JavaScriptu koristeći ovaj API. API vam omogućuje stvaranje WebSocket objekta, putem kojeg stvarate WebSocket vezu i komunicirate s WebSocket poslužiteljem.
Možete koristiti sljedeći format koda za stvaranje WebSocket objekta:
neka exampleSocket = new WebSocket("wss://www.example.com/socketserver", "dummyProtocol");Prvi argument konstruktoru je URI WebSocket poslužitelja s kojim želite stvoriti vezu. Uvijek će započeti s "ws" ili "wss". Drugi argument nije obavezan. Njegova je vrijednost niz ili niz nizova, koji specificiraju potprotokole koje podržavate.
Objekt WebSocket ima svojstvo samo za čitanje pod nazivom readyState. Pristup ovom svojstvu daje trenutno stanje WebSocket veze. readyState ima četiri moguće vrijednosti: "connecting", "open", "closing" i "closed".
Kada se ta linija koda pokrene, preglednik će se pokušati spojiti na navedeni poslužitelj. Povezivanje neće biti dovršeno odjednom, pa će readyState za exampleSocket biti "povezivanje". Poruke se ne mogu slati niti primati dok se veza ne završi, a tada će vrijednost readyState postati "otvorena".
The primjerSocket objekt ima slušatelja događaja (koji se razlikuje od slušatelji DOM događaja) pod nazivom "onopen" koji vam omogućuje izvođenje daljnjih radnji tek nakon uspostavljanja veze. Objekt također ima metodu "slanja" koja vam omogućuje slanje nizova, Blobova (binarni podaci) i ArrayBuffers kao poruka poslužitelju.
Evo primjera njihove zajedničke upotrebe:
primjerSocket.onopen = funkcija (događaj) {
primjerSocket.send("WebSocket je stvarno cool");
};API također pruža način na koji možete reagirati na poruke koje poslužitelj šalje. To se radi pomoću slušatelja događaja "onmessage". Evo primjera:
primjerSocket.onmessage = funkcija (događaj) {
konzola.log(događaj.podaci);
}Umjesto toga, možete i pisati funkcija strelice:
exampleSocket.onmessage = (event) => { konzola.log (događaj.podaci); }API također pruža a Zatvoriti() način zatvaranja veze. Evo kako to izgleda:
primjerSocket.Zatvoriti();WebSocket omogućuje učinkovitu dvosmjernu komunikaciju
WebSocket je dvosmjerni komunikacijski protokol. Poslužitelji i preglednici implementiraju nizove protokola za komunikaciju pomoću WebSocketa. WebSocket postoji jer HTTP nije dizajniran da bude dvosmjeran. Postoje metode za implementaciju dvosmjernih veza s HTTP-om, ali one imaju problema.
WebSocket je moćna tehnologija, ali nije neophodna u svim slučajevima jer može značajno zakomplicirati arhitekturu aplikacije. Korištenje WebSocketa na strani klijenta vrši se pomoću WebSocket API preglednika.