WebSocket to integralna technologia w wielu nowoczesnych aplikacjach internetowych. Jeśli piszesz kod dla sieci, prawdopodobnie słyszałeś już ten termin, ale być może nie masz pewności, co to właściwie jest i jak go używać. Na szczęście WebSocket nie jest złożoną koncepcją i dość szybko można go zrozumieć.
Co to jest WebSocket?
WebSocket to niestety jedna z tych nazw, które na pierwszy rzut oka wydają się nie mieć sensu. WebSocket to właściwie nazwa protokół komunikacyjny która pozwala na dwukierunkową komunikację między klientem a serwerem WWW.
Mówiąc prościej, WebSocket to technologia, która umożliwia klientowi i serwerowi tworzenie połączenia, w którym każda ze stron może w dowolnym momencie wysłać drugiej wiadomości.
Różni się to od zwykłego połączenia HTTP, w którym klient musi zainicjować żądanie i dopiero wtedy serwer może wysłać odpowiedź. W rzeczywistości WebSocket jest zupełnie innym protokołem komunikacyjnym niż HTTP, który został zaprojektowany tak, aby był kompatybilny z HTTP. Gdy aplikacja kliencka chce zainicjować połączenie WebSocket, musi użyć przycisku
Mechanizm aktualizacji HTTP aby przełączyć się na protokół WebSocket.W tym momencie możesz pomyśleć: „protokół to tylko zestaw reguł, jak możesz go użyć do kodowania?”.
Brakujący element to coś, co nazywa się stos protokołów. Zasadniczo urządzenia obsługujące protokół mają wbudowany sprzęt i oprogramowanie, które umożliwiają pisanie aplikacji komunikujących się za pomocą protokołu. Protokół nie jest bezpośrednio używany do budowania czegokolwiek.
Dlaczego stworzono WebSocket?
Aby zilustrować potrzebę korzystania z WebSocket, rozważ mechanizm czatowania w Internecie.
Ktoś wysyła wiadomość do serwera czatu ze swojego urządzenia, ale serwer nadal musi wysłać tę wiadomość na Twoje urządzenie, zanim będziesz mógł ją przeczytać. Jeśli serwer używa protokołu HTTP, serwer nie może bezpośrednio przekazać tej wiadomości do Ciebie, ponieważ serwer nie może inicjować żądań.
Istnieje kilka sposobów rozwiązania tego problemu za pomocą protokołu HTTP. Jednym ze sposobów jest ciągłe wysyłanie przez klienta żądań aktualizacji do serwera, a serwer przekaże wszelkie dane, które posiada w odpowiedzi. Ta technika nazywa się sondowaniem, a każde żądanie jest nazywane sondowaniem. Istnieją dwa warianty sondowania: sondowanie długie i sondowanie krótkie.
Użycie wariantu długiego odpytywania oznacza, że urządzenie klienckie nieustannie pyta serwer, czy są dostępne nowe wiadomości. Jeśli dostępne są nowe wiadomości, serwer wyśle je jako odpowiedź. Jeśli nie, serwer opóźniłby odpowiedź i utrzymałby otwarte połączenie, dopóki nie będzie miał danych do odesłania, a wtedy klient natychmiast wykona nowe żądanie.
Ta technika jest nieefektywna, ponieważ HTTP nie został zaprojektowany do tego celu. Działa adekwatnie na małą skalę, ale każde żądanie HTTP wiąże się z wysłaniem dodatkowych danych w nagłówek i powoduje znaczne zwiększenie obciążenia serwera, gdy odpytuje wielu klientów to.
Oto diagram ilustrujący długie odpytywanie:
Wariant krótkiego odpytywania jest jeszcze mniej wydajny. W przypadku krótkiego odpytywania serwer nie utrzymuje otwartego połączenia, dopóki nie pojawią się nowe dane, co oznacza, że klient musi odpytywać serwer w stałych, bardzo krótkich odstępach czasu.
Inną techniką dwukierunkowej komunikacji w HTTP jest przesyłanie strumieniowe.
W streamingu, po wysłaniu pierwszego żądania, serwer utrzymuje połączenie otwarte przez czas nieokreślony, wysyłając nowe informacje jako ciągłe częściowe odpowiedzi do klienta.
Korzystanie z przesyłania strumieniowego skutkuje mniejszym narzutem danych i obciążeniem serwera niż odpytywanie, ponieważ w idealnym przypadku klient wysyła tylko jedno żądanie HTTP. Niestety w pewnych warunkach przesyłanie strumieniowe powoduje problemy, ponieważ przeglądarki i pośrednicy sieciowi (np. serwery proxy) często próbują sobie z tym poradzić częściowe odpowiedzi jako uszkodzone fragmenty jednej dużej odpowiedzi HTTP (co jest normalnym zachowaniem HTTP), a nie jako oddzielne wiadomości, do których były przeznaczone być.
WebSocket został stworzony, aby rozwiązać te problemy. W przeciwieństwie do protokołu HTTP, WebSocket został zaprojektowany specjalnie do komunikacji dwukierunkowej. Dzięki WebSocket po otwarciu połączenia klient i serwer mogą wysyłać wiadomości tam iz powrotem bez problemów z odpytywaniem lub przesyłaniem strumieniowym.
Przypadki użycia dla WebSocket
WebSocket jest świetny, ale to nie znaczy, że powinien być używany wszędzie.
Wdrożenie WebSocket może zwiększyć złożoność Twojej aplikacji, szczególnie po stronie serwera, więc nie powinno się tego robić, chyba że masz ku temu dobry powód. To nasuwa pytanie: jak wygląda dobry powód?
WebSocket jest idealny do zastosowań, w których wymagana jest częsta komunikacja dwukierunkowa z małymi opóźnieniami. Innymi słowy, WebSocket zapewnia przewagę aplikacjom, które muszą komunikować się często lub na dużą skalę. Jeśli komunikacja nie musi odbywać się w czasie rzeczywistym lub aplikacja nigdy nie rozrośnie się na dużą skalę, sondowanie lub przesyłanie strumieniowe mogą być wystarczające do użycia w tej aplikacji.
Typowe zastosowania WebSocket to tworzenie aplikacji do czatowania, gier online dla wielu graczy, współpracy w czasie rzeczywistym i oprogramowania do powiadamiania itp.
Jak korzystać z WebSocket po stronie klienta
Korzystanie z WebSocket po stronie serwera może być dość skomplikowane, a proces różni się znacznie w zależności od języka (np C#, Jawa, itp.) i wybraną bibliotekę, więc nie będziemy tego tutaj omawiać. Następnie krótko omówimy, jak używać WebSocket po stronie klienta.
Wszystkie nowoczesne przeglądarki implementują internetowy interfejs API o nazwie WebSocket API, który jest stosem protokołów przeglądarki dla protokołu WebSocket. Możesz używać WebSocket w JavaScript za pomocą tego API. API umożliwia utworzenie obiektu WebSocket, za pomocą którego tworzysz połączenie WebSocket i wchodzisz w interakcję z serwerem WebSocket.
Do utworzenia obiektu WebSocket można użyć następującego formatu kodu:
let exampleSocket = nowy WebSocket("wss://www.example.com/socketserver", "manekinProtokół");Pierwszym argumentem konstruktora jest identyfikator URI serwera WebSocket, z którym chcesz nawiązać połączenie. Zawsze zaczyna się od „ws” lub „wss”. Drugi argument jest opcjonalny. Jego wartością jest ciąg znaków lub tablica ciągów, która określa obsługiwane protokoły podrzędne.
Obiekt WebSocket ma właściwość tylko do odczytu o nazwie readyState. Dostęp do tej właściwości zapewnia bieżący stan połączenia WebSocket. readyState ma cztery możliwe wartości: „connecting”, „open”, „closing” i „closed”.
Po uruchomieniu tego wiersza kodu przeglądarka spróbuje połączyć się z określonym serwerem. Połączenie nie zostanie zakończone od razu, więc stanem gotowości exampleSocket będzie „łączenie”. Żadne wiadomości nie mogą być wysyłane ani odbierane, dopóki połączenie nie zostanie zakończone, kiedy to wartość readyState stanie się „otwarta”.
The przykład Gniazdo obiekt posiada detektor zdarzeń (który różni się od Detektory zdarzeń DOM) o nazwie „onopen”, która umożliwia wykonywanie dalszych czynności dopiero po nawiązaniu połączenia. Obiekt ma również metodę „send”, która umożliwia wysyłanie ciągów, obiektów BLOB (dane binarne) i ArrayBuffers jako wiadomości do serwera.
Oto przykład użycia tych elementów razem:
exampleSocket.onopen = funkcjonować (wydarzenie) {
przykładSocket.send("WebSocket jest naprawdę fajny");
};Interfejs API umożliwia również reagowanie na wiadomości wysyłane przez serwer. Odbywa się to za pomocą detektora zdarzeń „onmessage”. Oto przykład:
exampleSocket.onmessage = funkcjonować (wydarzenie) {
konsola.dziennik(wydarzenie.dane);
}Zamiast tego możesz też pisać funkcja strzałki:
exampleSocket.onmessage = (zdarzenie) => { konsola.log (dane.zdarzeń); }API zapewnia również blisko() metodę zamknięcia połączenia. Oto jak to wygląda:
przykład Gniazdo.blisko();WebSocket umożliwia wydajną komunikację dwukierunkową
WebSocket to dwukierunkowy protokół komunikacyjny. Serwery i przeglądarki implementują stosy protokołów do komunikacji za pomocą WebSocket. WebSocket istnieje, ponieważ protokół HTTP nie został zaprojektowany jako dwukierunkowy. Istnieją metody implementacji połączeń dwukierunkowych za pomocą protokołu HTTP, ale mają one problemy.
WebSocket to potężna technologia, ale nie jest konieczna we wszystkich przypadkach, ponieważ może znacznie skomplikować architekturę aplikacji. Korzystanie z WebSocket po stronie klienta odbywa się za pomocą przeglądarki WebSocket API.