Javascript websocket: opis, zasada działania, zastosowanie

WebSockets (WS) - połączenie serwer-klient w celu uzyskania informacji ze strony serwera bez konieczności wcześniejszego zapytania strony klienta, otrzymując tzw. PUSH-notification. Idealnym układem dla JavaScript WebSocket byłoby posiadanie pojedynczego wątku po stronie serwera, który przetwarza informacje, takie jak nasłuchiwanie zmian w bazie danych lub zdarzeń wywołanych przez inne procesy, w celu wysłania informacji do wszystkich klientów w tym samym czasie bez korzystania z zasobów. Klient WebSocket w JS i HTML5 z wykorzystaniem interfejsu WS, zapewnianego przez większość nowoczesnych przeglądarek: IE 10+, Chrome 16+, Firefox 11+, Safari 6+.

Definicja WebSockets

Gniazda internetowe są zdefiniowane jako dwukierunkowa komunikacja pomiędzy serwerem a klientem. Kluczem do JavaScript WebSocket jest prawdziwa równoległość i optymalizacja wydajności, co skutkuje bardziej responsywnymi i bogatszymi aplikacjami internetowymi.

Protokół ustanawia komunikację full-duplex od podstaw. Web sockets to krok naprzód w przenoszeniu funkcjonalności desktopów do przeglądarek. Pokazują one nowy etap ewolucji, który był od dawna przewidywany w technologii klient/serwer w Internecie.

Główne cechy JavaScript WebSocket są następujące:

1. Protokół ten jest standaryzowany, co oznacza, że może być używany do nawiązywania komunikacji w czasie rzeczywistym pomiędzy serwerami internetowymi a klientami.
2. Web sockets ewoluuje w kierunku międzyplatformowego standardu komunikacji w czasie rzeczywistym pomiędzy klientem a serwerem.
3. Standard pozwala na nowy rodzaj zastosowania.
4. Dzięki tej technologii przedsiębiorstwa działające w czasie rzeczywistym mogą przyspieszyć.

Największą zaletą JavaScript WebSocket jest dwukierunkowa komunikacja (full duplex) w ramach jednego połączenia TCP. HTTP ma swój własny zestaw schematów, takich jak http i https. Protokół gniazda internetowego ma również podobny schemat zdefiniowany w swoim wzorcu URL. Najnowsza specyfikacja protokołu WS jest określona jako RFC 6455 - proponowany standard. RFC 6455 jest obsługiwany przez różne przeglądarki, takie jak Internet Explorer, Mozilla Firefox, Google Chrome.

Łącze dupleksowe

Zanim przejdziemy do konieczności stosowania gniazd internetowych, musimy przyjrzeć się istniejącym metodom, które są używane do dwustronnej komunikacji klienta Java WebSocket. Są one następujące:

• głosowanie;
• długi sondaż;
• streaming;
• postback i AJAX;
• HTML5.

Polling można zdefiniować jako metodę, która wykonuje okresowe żądania niezależnie od danych istniejących w transmisji. Są one przesyłane w sposób zsynchronizowany. Odpowiedź serwera zawiera dostępne dane lub pewne ostrzeżenia.

Long polling, jak sama nazwa wskazuje, polega na podobnej technice ankietowania. Klient i serwer utrzymują połączenie aktywne do momentu otrzymania danych lub upłynięcia czasu timeout. Jeśli połączenie zostanie z jakiegoś powodu utracone, klient Java WebSocket może ponownie uruchomić procedurę i wykonać kolejne żądanie. Długie pollingi to nic innego jak poprawa wydajności nad procesem pollingu, ale ciągłe pollingi mogą spowolnić proces.

Opcje strumieniowania i AJAX

Jest to uważane za najlepszą opcję dla transferu danych w czasie rzeczywistym. Serwer utrzymuje otwarte i aktywne połączenie z klientem do momentu otrzymania niezbędnych danych. W tym przypadku połączenie jest uważane za otwarte na czas nieokreślony. Streaming zawiera nagłówki HTTP zwiększające rozmiar pliku i opóźnienia. Można to uznać za istotną wadę.

Jest to skrócona forma asynchronicznego Javascript i XML. Obiekt XmlHttpRequest umożliwia wykonanie skryptu Javascript bez przeładowywania całej strony internetowej. AJAX wysyła i odbiera tylko część strony internetowej. Główne wady AJAX w porównaniu do websocketów JavaScript to

1. Wysyła nagłówki HTTP, co zwiększa całkowity rozmiar.
2. Komunikacja odbywa się w trybie half-duplex.
3. Serwer WWW zużywa więcej zasobów.

HTML5 to solidny framework do tworzenia i projektowania aplikacji internetowych. Głównymi filarami są znaczniki API, CSS3 i Javascript.

Funkcjonalność

WebSocket stanowi duży postęp w historii komunikacji internetowej. Przed jego powstaniem cała komunikacja między klientami sieciowymi a serwerami opierała się wyłącznie na protokole HTTP. Web Socket pomaga w dynamicznym przepływie połączeń, które zawsze są w trybie full-duplex. Full-duplex odnosi się do komunikacji na obu końcach z dużą prędkością. Nazywany jest game-changerem, ponieważ skutecznie pokonuje wszystkie niedociągnięcia istniejących protokołów.

Znaczenie WS dla deweloperów i architektów:

1. Niezależny protokół oparty na TCP, zaprojektowany do obsługi każdego innego protokołu, który tradycyjnie działa tylko na szczycie czystego połączenia TCP.
2. Warstwa transportowa, na której może działać każdy inny protokół.

Websocket API wspiera możliwość definiowania podprotokołów - bibliotek protokołów, które mogą interpretować określone typy protokołów. Przykładami takich protokołów są XMPP, STOMP i AMQP. Programiści nie muszą już myśleć o rodzaju połączenia w kategoriach paradygmatu HTTP żądanie-odpowiedź.

Jedynym wymaganiem po stronie przeglądarki jest uruchomienie biblioteki JavaScript, która może interpretować uścisk dłoni WS oraz ustanowić i utrzymać połączenie. Po stronie serwera, standardem przemysłowym jest użycie istniejących bibliotek protokołów, które działają na szczycie TCP i używają bramy.

Funkcjonalność Web Sockets:

1. Połączenia przez WebSocket są inicjowane przez HTTP.
2. Serwery HTTP zazwyczaj interpretują uścisk dłoni WS jako żądanie aktualizacji.
3. Gniazda sieciowe mogą być rozszerzeniem istniejącego środowiska HTTP i mogą zapewnić niezbędną infrastrukturę do dodania funkcjonalności sieciowej. Polegają one na bardziej zaawansowanych, pełnodupleksowych protokołach, które mogą przekazywać dane w obu kierunkach pomiędzy klientem JavaScript WebSocket a serwerem.

Implementacja klienta w JavaScript

Kod źródłowy pliku JavaScript o nazwie wsclient.js w stronie HTML5, aby mógł otworzyć połączenie WebSocket. Skrypt zawiera kod do stworzenia klienta WS przy użyciu jego interfejsu.

Prosta strona HTML5 jest używana do stworzenia formularza łączącego się z punktem końcowym serwera i wymieniającego wiadomości. Strona HTML wykorzystuje wsclient.js, aby uruchomić plik HTML, otwórz go w przeglądarce, np. Google Chrome, wybierając "Plik -> "Open".

Prosty serwer może być łatwo zaimplementowany w Javie. Zwraca po prostu wiadomość z dużymi literami otrzymaną od klienta:

1. Otwórz formularz wsclient.html w przeglądarce internetowej i wpisuje wymagane parametry połączenia WebSocket, a następnie klika przycisk "Connect". Jeśli połączenie zakończyło się sukcesem, przycisk zostanie wyłączony, a przycisk "Wyłącz" zostanie włączony.
2. Wprowadź wiadomość w polu "Tekst wiadomości" i naciśnij przycisk "Wyślij". Serwer wyświetli go dużymi literami, a klient JavaScript wyświetli go w obszarze tekstowym.
3. "Narzędzia dla programistów" Google Chrome jest dobrym narzędziem do poznawania połączeń WebSocket. W "Narzędzia dla programistów" przejdź do zakładki "Sieć" i wybierz WS, aby zobaczyć listę wszystkich połączeń dla bieżącej strony.
4. Kliknij zakładkę Header, aby zobaczyć wartości żądania i odpowiedzi.
5. Karta Ramki zawiera listę wszystkich wychodzących i przychodzących wiadomości. Pierwsza wiadomość to to, co zostało wysłane od klienta do serwera, a druga wiadomość to echo serwera napisane wielkimi literami.
6. Zakładka Timing pokazuje, jak długo połączenie było otwarte.
7. Konsole są używane do przeglądania bieżącej instancji WS, który znajduje się na w zakresie strony HTML.
8. Wpisz w JavaScript nazwę zmiennej WebSocket, WS, a konsola wydrukuje reprezentację JSON obiektu.
9. ReadyState. Właściwość obiektu pokazuje stan połączenia. Wartość 1 oznacza, że jest on otwarty i gotowy do odbierania i wysyłania wiadomości. Może być używany sprawdzać WS połączenia przed próbą transmisji danych. Jeśli połączenie zostanie zamknięte, można zaimplementować logikę, która pozwoli na jego ponowne automatyczne nawiązanie.
10. Wireshark to bardzo wszechstronne i przydatne narzędzie do monitorowania ruchu sieciowego. Można go pobrać bezpłatnie z oficjalnej strony. Po zainstalowaniu należy go uruchomić i wybrać interfejs sieciowy do przechwytywania ruchu.
11. Aby zobaczyć tylko ruch WS, wpisz websocket w polu filtra. Kliknij na ramkę, aby zobaczyć jej zawartość, w tym rzeczywistą treść wiadomości. Przewiń w dół do węzła Dane tekstowe oparte na liniach i rozwiń go.
12. Kliknij prawym przyciskiem myszy na skompresowany payload i wybierz "Show packet bytes". W oknie dialogowym wybierz "Compressed" z listy rozwijanej Decode, aby zobaczyć ładunek jako zwykły tekst.

Konfiguracja sprężyny Java WebSocket

Spring-boot-starter-websocket - zapewnia przydatne wartości domyślne dla WS. Najpierw należy skonfigurować brokera komunikatów STOMP. WebSocketConfig.Java definiuje punkt końcowy STOMP brokera komunikatów i punkt końcowy aplikacji websocket.@Konfiguracja - klasa konfiguracyjna Springa.

EnableWebSocketMessageBroker - włącza przetwarzanie wiadomości obsługiwane przez brokera. To używa STOMP jako brokera wiadomości.

Metoda ConfigureMessageBroker () pozwala prostemu mediatorowi opartemu na pamięci przekazać wiadomości do klienta z prefiksami "/topic" i "/queue". Precyzuje również "/app" dla tych związanych z niepoprawnymi metodami mapowania @Message w klasie kontrolera. Ten prefiks będzie używany do identyfikacji wszystkich mapowań wiadomości. Na przykład "/app/message" jest punktem końcowym, dla którego mapowana jest metoda WebSocket Controller.processMessage From Client ().

Podobnie, RegisterStompEndpoints () włącza obsługę STOMP i rejestruje punkty końcowe stomp w "/greetings. To spowoduje, że wszystkie wiadomości gniazda sieciowego JavaScript będą kierowane przez STOMP, który dodaje dodatkową warstwę bezpieczeństwa do punktu końcowego gniazda sieciowego. Podczas tworzenia połączenia WS z javascript, tylko ten konkretny punkt końcowy Stomp jest używany.

W poniższej konfiguracji należy wprowadzić następujące zmiany, aby umożliwić wsparcie dla SockJs w celu zapewnienia opcjonalnej akcji odwrotnej.addEndpoint ("/hello") .withSockJS ().

Zaletą użycia sockJS jest to, że gdy połączenie z gniazdem internetowym jest zerwane lub nie może być ustanowione, zostanie ono zdegradowane do HTTP i komunikacja między klientem a serwerem może nadal trwać.

Obsługa błędów

Gdy tylko zostanie nawiązane połączenie między klientem a serwerem, z instancji WS wyzwalane jest zdarzenie Open. Błędy występujące podczas komunikacji są generowane. Jest to wykrywane przez zdarzenie OnError. Po błędzie zawsze następuje rozłączenie.

OnError - zdarzenie to jest wywoływane w momencie, gdy coś pójdzie nie tak pomiędzy komunikacją. Po błędzie zdarzenia następuje zakończenie połączenia. Zaleca się, aby zawsze informować użytkownika o nieoczekiwanych błędach i próbować ponownie nawiązać połączenie.

Jeśli chodzi o obsługę błędów, należy uwzględnić zarówno parametry wewnętrzne, jak i zewnętrzne:

1. Wewnętrzne obejmują błędy, które mogą być generowane z powodu błędów w kodzie lub nieoczekiwanego zachowania użytkownika.
2. Błędy zewnętrzne nie mają nic wspólnego z aplikacją, a raczej z parametrami, których nie można kontrolować. Najważniejszym z nich jest połączenie z siecią.
3. Każda interaktywna dwukierunkowa aplikacja internetowa wymaga aktywnego połączenia z Internetem.

Sprawdzanie dostępności sieci

W nowoczesnych aplikacjach desktopowych i mobilnych częstym zadaniem jest sprawdzanie dostępności sieci. Najczęstszy sposób dla WebSocket php JavaScript - wykonanie żądania HTTP do strony internetowej, która ma być aktywowana, np. google.com. Jeśli żądanie się powiedzie, urządzenie stacjonarne lub mobilne zgłasza, że istnieje aktywne połączenie. Podobnie HTML posiada XMLHttpRequest do wykrywania dostępności sieci.

HTML5 uczynił ten proces jeszcze prostszym i zapewnił sposób na sprawdzenie, czy przeglądarka może odbierać odpowiedzi internetowe. Można to osiągnąć za pomocą nawigatora obiektów.

Offline oznacza, że albo urządzenie nie jest podłączone, albo użytkownik wybrał tryb offline z paska narzędzi przeglądarki.

Testowanie Java WebSocket używa prostego klienta WS. Po nawiązaniu połączenia wysyła dane do serwera i drukuje otrzymaną odpowiedź: import websocket.

Zdarzenia OnOpen, OnClose i OnMessage

Serwer WebSocket jest prostym programem, który może obsługiwać zdarzenia i akcje WS. Zazwyczaj udostępnia on metody podobne do API klienta. Jednocześnie większość języki programowania zapewnić implementację komunikacji pomiędzy serwerem a klientem WebSocket, podkreślając inicjowane zdarzenia i akcje.

Serwer WebSocket działa w podobny sposób jak klienci. Reaguje na zdarzenia i w razie potrzeby wykonuje działania. Niezależnie od używanego języka programowania, każdy serwer WebSocket wykonuje pewne procedury. Inicjalizuje się pod adresem gniazda internetowego, obsługuje zdarzenia OnOpen, OnClose i OnMessage oraz wysyła wiadomości do klientów. Istnieją cztery główne zdarzenia Websocket API:

• otwarte;
• komunikat;
• zamknięta;
• błąd.

Każde ze zdarzeń jest obsługiwane przez implementację funkcji takich jak odpowiednio OnOpen, OnMessage , OnClose i OnError. Można to również zaimplementować za pomocą metody addEventListener.

Instancja gniazdek internetowych w Javie

Każdy serwer WS wymaga prawidłowego hosta i portu. Przykład tworzenia instancji Websocket na serwerze: var server = new WebSocketServer("ws://localhost:8181").

Każdy poprawny adres URL może być użyty ze specyfikacją portu, który nie był wcześniej używany. Bardzo przydatna jest ewidencja podłączonych klientów, ponieważ gromadzi i przechowuje różne dane lub wysyła różne wiadomości do każdego z nich.

Fleck reprezentuje przychodzące połączenia (klientów) za pomocą interfejsu IwebSocketConnection. Za każdym razem, gdy ktoś łączy się lub rozłącza z usługą, pusta lista może zostać utworzona lub zaktualizowana: var clients = new List ().

Następnie wywołaj metodę Start i poczekaj aż klienci się połączą. Po uruchomieniu serwer może odbierać połączenia przychodzące. We Fleck, metoda Start wymaga parametru określającego gniazdo, które wywołało zdarzenie: serwer.Start(gniazdo) =>{});

Aby zaimplementować serwer WebSocket w C#, konieczne jest użycie zewnętrznej biblioteki. Aby uzyskać ten sam wynik w Javie, wykorzystuje technologię zawartą w bibliotece standardowej za pomocą pakietu javax.websocket, począwszy od Java EE 7.

Tworzenie projektu klienta Java WebSocket opartego na Java EE 7 przy użyciu jednego z darmowych IDE online, jak Eclipse czy NetBeans. W NetBeans utwórz nową aplikację internetową i upewnij się, że używasz GlassFish jako serwera (wersja 4.0). Jeśli użytkownik woli używać Eclipse, musi wybrać Tomcat 8. Zdefiniuj więc pakiet, który może być nazwany MyServer i wewnątrz tego pakietu utwórz klasę WebSocket Server. Kod do implementacji serwera jest dość czytelny, a jego zachowanie łatwy do zrozumienia.

Zalety gniazda sieciowego

WS rozwiązuje kilka problemów z REST lub HTTP. HTTP jest protokołem jednokierunkowym, gdzie klient zawsze inicjuje żądanie. Serwer przetwarza i zwraca odpowiedź, a następnie klient używa. Websocket jest dwukierunkowym protokołem bez predefiniowanych wzorców wiadomości, takich jak żądanie/odpowiedź. Zarówno klient jak i serwer mogą wysłać wiadomość do drugiej strony.

HTTP pozwala na przejście komunikatu żądania z klienta do serwera, a następnie serwer wysyła odpowiedź. W pewnym momencie klient komunikuje się z serwerem lub odwrotnie. Zazwyczaj nowe połączenie TCP jest inicjowane dla żądania HTTP i kończone po otrzymaniu odpowiedź. Dla pozostałych żądań / odpowiedzi HTTP musi zostać nawiązane nowe połączenie TCP.

Dla WS połączenie HTTP jest aktualizowane przy użyciu standardowego mechanizmu aktualizacji. Klient i serwer wymieniają dane przez to samo połączenie TCP w ramach cyklu życia połączenia WS.

Websocket jest protokołem niskiego poziomu. Wszystko, w tym prosty wzór żądania/odpowiedzi, sposoby tworzenia, aktualizowania, usuwania wymaganych zasobów i kody statusu. Wszystkie one są dokładnie zdefiniowane dla HTTP.

WS jest protokołem typu stateful, natomiast HTTP jest protokołem typu non-stateful.

Połączenia WS mogą skalować się pionowo na jednym serwerze, podczas gdy HTTP może skalować się poziomo. Istnieje kilka autorskich rozwiązań do skalowania poziomego, ale nie są one oparte na standardach.

HTTP ma wiele innych zalet, takich jak buforowanie, routing i multipleksowanie. Wszystko to musi być zdefiniowane na szczycie WebSocket i bazy danych Java.