Javascript websocket: leírás, működési elv, alkalmazás

WebSockets (ws) - a szerver és az ügyfél közötti kapcsolat, hogy információt kapjon a szerverről anélkül, hogy először kérnie kellene az ügyfél részt, úgynevezett PUSH értesítést kapva. A Javascript WebSocket interakció ideális sémája úgy néz ki, hogy a szerver részben van egy szál, amely feldolgozza az információkat, például figyeli az adatbázis változásait vagy más folyamatok által kiváltott eseményeket, hogy egyszerre küldjön információkat minden ügyfélnek erőforrások használata nélkül. A WebSocket kliens JS és HTML5 a WS interfész által biztosított legtöbb modern böngészők: IE 10+, Chrome 16+, Firefox 11+, Safari 6+.

WebSockets definíciója

WebSockets definíciója

Web sockets definiáljuk, mint egy kétirányú kommunikáció a szerver és a kliens. A Javascript WebSocket legfontosabb pontjai a valódi konkurencia és a teljesítmény optimalizálása, ami rugalmasabb és gazdagabb webes alkalmazásokhoz vezet.

A protokoll teljes duplex kommunikációt hoz létre a semmiből. A webes aljzatok előrelépést jelentenek az asztali funkciók biztosításában a böngészőkben. Bemutatják az evolúció új szakaszát, amelyet hosszú ideje vártak az ügyfél / szerver internetes technológiájában.

A Javascript WebSocket főbb jellemzői a következők:

  1. A protokoll szabványosított, ami azt jelenti, hogy valós időben lehetséges a webszerverek és az ügyfelek közötti kommunikáció megszervezése.
  2. A Web socketek platformközi szabványokká válnak az ügyfél és a szerver közötti valós idejű kommunikációhoz.
  3. A szabvány új típusú alkalmazást tesz lehetővé.
  4. Ezzel a technológiával a valós idejű vállalkozások felgyorsíthatják munkájukat.

A Javascript WebSocket legnagyobb előnye a kétirányú kommunikáció (teljes duplex) egyetlen TCP kapcsolaton keresztül. A HTTP-nek saját sémái vannak, például http és https. A Web Socket protokollnak is van egy hasonló sémája, amelyet az URL-sablonja határoz meg. A legújabb ws protokoll specifikáció RFC 6455 - a javasolt szabvány. RFC 6455 támogatja a különböző böngészők, mint például az Internet Explorer, Mozilla Firefox, Google Chrome.

Duplex kommunikáció

Duplex kommunikáció

Mielőtt folytatná a webes aljzatok használatának szükségességét, meg kell nézni a duplex kommunikációs kliens Java WebSocket meglévő módszereit. Ezek a következők:

  • szavazás;
  • hosszú felmérés;
  • adatfolyam;
  • postback és AJAX;
  • HTML5.

A lekérdezés olyan módszerként definiálható, amely időszakos lekérdezéseket hajt végre az átvitelben létező adatoktól függetlenül. Szinkronban küldik őket. A kiszolgáló válasza tartalmazza a rendelkezésre álló adatokat vagy néhány figyelmeztetést.

Egy hosszú felmérés, amint a neve is sugallja, hasonló felmérési technikát foglal magában. Az ügyfél és a kiszolgáló addig tartja aktívnak a kapcsolatot, amíg bizonyos adatok nem érkeznek, vagy az időtúllépés le nem jár. Ha a kapcsolat bármilyen okból megszakad, a Java WebSocket kliens újra elindíthatja az eljárást, és végrehajthat egy szekvenciális kérést. A hosszú lekérdezés nem más, mint a teljesítmény javulása a lekérdezési folyamathoz képest, de az állandó lekérdezések lelassíthatják a folyamatot.

Streaming és AJAX opciók

Ez a legjobb megoldás a valós idejű adatátvitelhez. A szerver nyitva tartja a kapcsolatot az ügyféllel, amíg a szükséges adatok meg nem érkeznek. Ebben az esetben a kapcsolat határozatlan időre nyitottnak tekinthető. A Streaming olyan HTTP fejléceket tartalmaz, amelyek növelik a fájlméretet és a késleltetést. Ez a fő hátránynak tekinthető.

Ez az aszinkron Javascript és XML rövidített formája. Az XMLHttpRequest objektum lehetővé teszi a Javascript végrehajtását a teljes weboldal újratöltése nélkül. Az AJAX csak a weboldal egy részét küldi és fogadja. Az AJAX fő hátrányai a JavaScript websocketekhez képest:

  1. HTTP fejlécek küldése, ami növeli a teljes méretet.
  2. Félduplex kommunikáció.
  3. A webszerver több erőforrást fogyaszt.

A HTML5 megbízható keretrendszer webes alkalmazások fejlesztéséhez és tervezéséhez. A fő pillérek a jelölő API-k, a CSS3 és a Javascript.

Funkcionalitás

Funkcionalitás

A WebSocket jelentős frissítést jelent a webes kommunikáció történetében. Fennállása előtt a webes kliensek és szerverek közötti kommunikáció csak HTTP-n alapult. Web Socket segít a dinamikus áramlását kapcsolatok, amelyek állandó full-duplex. A teljes duplex mindkét végről jelentős gyors sebességű kommunikációra utal. Ezt játékváltónak nevezik, mivel hatékonyan leküzdi a meglévő protokollok összes hiányosságát.

A WS fontossága a fejlesztők és építészek számára:

  1. A TCP-n alapuló független protokoll, amelyet bármely más protokoll támogatására terveztek, amely hagyományosan csak tiszta TCP-kapcsolaton működik.
  2. Olyan szállítási réteg, amelyen bármely más protokoll működhet.

A Websocket API támogatja az alprotokollok — protokollkönyvtárak definiálásának képességét, amelyek bizonyos típusú protokollokat képesek értelmezni. Ilyen protokollok például az XMPP, a STOMP és az AMQP. A fejlesztőknek már nem kell gondolkodniuk a kapcsolat típusáról a HTTP" kérés-válasz " paradigma szempontjából.

, az egyetlen követelmény a böngésző oldalán egy JavaScript könyvtár elindítása, amely képes értelmezni a WS kézfogást, kapcsolatot létesíteni és fenntartani. A szerver oldalon az ipari szabvány a meglévő protokollkönyvtárak használata, amelyek a TCP tetején futnak, és átjárót használnak.

Webes aljzatok funkcionalitása:

  1. A WebSocket kapcsolatok HTTP-n keresztül kezdődnek.
  2. A HTTP-kiszolgálók általában a WS kézfogásokat frissítési kérelemként értelmezik.
  3. A webes aljzatok kiegészíthetik a meglévő HTTP-környezetet, és biztosíthatják a webes funkciók hozzáadásához szükséges infrastruktúrát. Fejlettebb full-duplex protokollokra támaszkodnak, amelyek lehetővé teszik az adatok továbbítását mindkét irányban a kliens JavaScript WebSocket kliens és a szerver között.

Kliens implementáció JavaScript-ben

A WSClient nevű JavaScript fájl forráskódja.a JS szerepel a HTML5 oldalon, így meg tudja nyitni a WebSocket kapcsolatot. A szkript kódot tartalmaz egy WS kliens létrehozásához az interfész segítségével.

Egy egyszerű HTML5 oldal segítségével létrehozhatunk egy űrlapot a szerver végpontjához való csatlakozáshoz és az üzenetek cseréjéhez. A HTML oldal wsclient-et használ.js script HTML fájl futtatásához nyissa meg azt egy böngészőben, például a Google Chrome-ban, a "fájl"kiválasztásával -> "Nyitott".

Egy egyszerű szerver könnyen megvalósítható a Java-ban. Csak nagybetűvel adja vissza az ügyféltől kapott üzenetet:

  1. Nyissa meg a wsclient űrlapot.html egy webböngészőben, írja be a szükséges WebSocket kapcsolati paramétereket, majd kattintson a "Connect". gomb ha a kapcsolat sikeresen létrejött, a gomb le lesz tiltva, a" Disconnect " gomb pedig engedélyezve lesz.
  2. Az üzenetet az "üzenet szövege" mezőbe vezetik, majd kattintson a "Küldés"gombra. a szerver nagybetűkkel jeleníti meg, a JavaScript kliens pedig a szöveges területen jeleníti meg.
  3. "Fejlesztői Eszközök" A Google Chrome jó eszköz a WebSocket kapcsolatok felfedezéséhez. Az ablakban "Fejlesztői Eszközök" ugrás a fülre "Hálózat" válassza a WS lehetőséget az aktuális oldal összes kapcsolatának listájának megtekintéséhez.
  4. Kattintson a" fejléc " fülre a kérés és a válaszértékek megtekintéséhez.
  5. A keretek lap felsorolja az összes kimenő és bejövő üzenetet. Az első üzenet az, amit az ügyfél küldött a kiszolgálónak, a második üzenet pedig a kiszolgáló visszhangja nagybetűkkel.
  6. Az időzítés fül mutatja, hogy a kapcsolat mennyi ideig volt nyitva.
  7. A konzolok a WS aktuális példányának megtekintésére szolgálnak, mi az a HTML oldal keretein belül.
  8. Írja be a WebSocket JavaScript változó nevét, WS, és a konzol kinyomtatja az objektum JSON ábrázolását.
  9. ReadyState. Az objektum tulajdonság megjeleníti a kapcsolat állapotát. Az 1 érték azt jelenti, hogy nyitva van, és készen áll az üzenetek fogadására és küldésére. Ezt fel lehet használni hogy ellenőrizze a WS kapcsolat az adatátvitel megkísérlése előtt. Ha a kapcsolat zárva van, az automatikus újracsatlakozás logikája megvalósítható.
  10. A Wireshark egy nagyon átfogó és hasznos eszköz a hálózati forgalom megfigyelésére. Ingyenesen letölthető a hivatalos weboldalról. A telepítés után futtassa, majd válassza ki a hálózati interfészt a forgalom rögzítéséhez.
  11. Ha csak a WS forgalmat szeretné megtekinteni, írja be a websocket parancsot a Szűrő mezőbe. Kattintson a keretre A tartalom megtekintéséhez, beleértve az üzenet tényleges hasznos terhelését. Görgessen le a vonal alapú szöveges adatcsomóponthoz, majd bontsa ki.
  12. Kattintson a jobb gombbal a tömörített hasznos teherre, majd válassza a "csomag bájtok megjelenítése"lehetőséget. A párbeszédpanelen válassza a "tömörített" lehetőséget a "dekódolás" legördülő listából a hasznos teher egyszerű szövegben történő megtekintéséhez.

Java WebSocket spring konfigurálása

Java WebSocket spring konfigurálása

Spring-boot-starter-websocket-hasznos alapértelmezett értékeket biztosít a WS számára. Először konfigurálja a STOMP üzenetközvetítőt. Az IT WebSocketConfig.A Java meghatározza az üzenetközvetítő STOMP végpontját és a websocket alkalmazás végpontját.@Configuration-tavaszi konfigurációs osztály.

EnableWebSocketMessageBroker — lehetővé teszi a bróker által támogatott üzenetfeldolgozást. Itt használják STOMP, mint egy üzenet bróker.

A ConfigureMessageBroker () metódus lehetővé teszi egy egyszerű memória-alapú közvetítő számára, hogy üzeneteket küldjön az ügyfélnek a " /topic "és" /queue "előtagokkal. Ezenkívül kijelöli az "/app" előtagot azok számára, akik az érvénytelenített @Message leképezési módszerekhez vannak társítva a controller osztályban. Ez az előtag az összes üzenet megjelenítésének azonosítására szolgál. Például az "/ app / message " az a végpont, amelyhez a WebSocket vezérlő tartozik.ProcessMessage a Client () metódus leképezve.

. Hasonlóképpen, a RegisterStompEndpoints () lehetővé teszi a STOMP támogatást, és regisztrálja a stomp végpontokat a "/greeting" - ben. Ugyanakkor az összes JavaScript web socket üzenet a STOMP-on keresztül kerül továbbításra, ami egy további biztonsági réteget is hozzáad a web socket végponthoz. Amikor ws-kapcsolatot hoz létre javascript-ből, csak ezt a konkrét végpontot használja a rendszer.

Az alábbi konfigurációban, annak érdekében, hogy a SockJS támogatás opcionális fordított műveletet biztosítson, a következő változtatásokat kell végrehajtani: beállításjegyzék.addEndpoint ("/üdvözlés") .withSockJS ().

A SockJS használatának előnye itt az, hogy amikor egy web socket kapcsolat megszakad, vagy nem hozható létre, akkor le lesz állítva HTTP-re, és a kliens és a szerver közötti kommunikáció továbbra is folytatódhat.

Java WebSocket spring konfigurálása

Hibakezelés

Amint létrejön a kapcsolat az ügyfél és a kiszolgáló között, a megnyitott esemény a WS példányból indul ki. A kommunikáció során előforduló hibák keletkeznek. Ezt a onError esemény segítségével határozzuk meg. A hiba előfordulását mindig kapcsolatszakadás kíséri.

onError-az eseményt akkor hívják meg, amikor valami rosszul megy a kommunikáció között. Az eseményhibát a kapcsolat megszakítása követi. Javasoljuk, hogy mindig tájékoztassa a felhasználót a váratlan hibákról, majd próbálja meg újra csatlakoztatni a kapcsolatot.

A hibakezelés során figyelembe kell venni mind a belső, mind a külső paramétereket:

  1. A belső paraméterek olyan hibákat tartalmaznak, amelyek a kód hibái vagy a váratlan felhasználói viselkedés miatt keletkezhetnek.
  2. A külső hibáknak semmi köze az alkalmazáshoz, inkább olyan paraméterekhez kapcsolódnak, amelyeket nem lehet ellenőrizni. Ezek közül a legfontosabb a hálózati kapcsolat.
  3. Bármely interaktív kétirányú webalkalmazáshoz aktív internetkapcsolat szükséges.

A hálózat elérhetőségének ellenőrzése

A modern asztali és mobil alkalmazásokban közös feladat a hálózat elérhetőségének ellenőrzése. A leggyakoribb módszer a WebSocket php JavaScript az, hogy egy HTTP kérést a honlapon, hogy aktiválni kell, például a google.com. Ha a kérés sikeres, az asztali vagy mobil eszköz jelzi, hogy aktív kapcsolat van. Hasonlóképpen, a HTML-nek van egy XMLHttpRequest a hálózat elérhetőségének meghatározásához.

A HTML5 még könnyebbé tette ezt a folyamatot, és bevezetett egy módszert annak ellenőrzésére, hogy a böngésző képes-e elfogadni a webes válaszokat. Ez az objektum navigátor segítségével érhető el.

A hálózat elérhetőségének ellenőrzése

Az Offline mód azt jelenti, hogy vagy az eszköz nincs csatlakoztatva, vagy a felhasználó az offline módot választotta a böngésző eszköztárán.

A Java WebSocket tesztelése egyszerű WS-klienst használ. Amint létrejön a kapcsolat, elküldik az adatokat a szervernek, és kinyomtatják a kapott választ: import websocket.

A Java WebSocket teszteléséhez

onOpen, onClose és onMessage események

A WebSocket Server egy egyszerű program, amely képes kezelni a WS eseményeket és műveleteket. Általában az ügyfél API-hoz hasonló módszereket biztosít. Ugyanakkor a legtöbb programozási nyelvek a WebSocket szerver és az ügyfél közötti kommunikáció megvalósítása, kiemelve a kezdeményezett eseményeket és műveleteket.

A WebSocket server hasonlóan működik, mint az ügyfelek. Reagál az eseményekre, és szükség esetén műveleteket hajt végre. A használt programozási nyelvtől függetlenül minden WebSocket szerver bizonyos eljárásokat hajt végre. Inicializálja a web socket címet, kezeli az onOpen, onClose és onMessage eseményeket, valamint üzeneteket küld az ügyfeleknek. Négy fő Websocket API esemény van:

  • nyitott;
  • üzenet;
  • zárva;
  • hiba.

Az események mindegyikét olyan végrehajtási funkciók kezelik, mint az onOpen, az onMessage, az onClose, illetve az onError. Ez az addEventListener módszerrel is megvalósítható.

A webes aljzatok példánya a Java-ban

Minden WS szerverhez érvényes host és port szükséges. Példa Websocket példány létrehozására egy kiszolgálón: var server = new WebSocketServer ("ws: / / localhost: 8181").

Bármely érvényes URL használható olyan port specifikációval, amelyet korábban nem használtak. Nagyon hasznos nyilvántartást vezetni a csatlakoztatott ügyfelekről, mivel különböző adatokat gyűjt össze, tárol, vagy különböző üzeneteket küld mindegyiküknek.

A Fleck a bejövő kapcsolatokat (klienseket) képviseli az IwebSocketConnection interfésszel. Amikor valaki csatlakozik vagy leválasztja a szolgáltatást, létrehozhat vagy frissíthet egy üres listát: var clients = new List ().

Ezután hívják a Start módszert, és várják, hogy az ügyfelek csatlakozzanak. Indítás után a kiszolgáló fogadhatja a bejövő kapcsolatokat. A Fleck-ben a Start metódusnak szüksége van egy paraméterre, amely meghatározza az eseményeket kiváltó aljzatot: szerver.Start (socket) =>{});

A WebSocket szerver C# - ban történő megvalósításához külső könyvtárat kell használnia. Ahhoz, hogy ugyanazt az eredményt érjük el a Java-ban, a javax csomagot használó szabványos könyvtárban található technológia előnyeit használjuk.websocket, kezdve Java EE 7.

Java EE 7 alapú Java WebSocket kliens projekt létrehozása az egyik ingyenes Online IDE környezet használatával, például Eclipse és NetBeans. A NetBeans új webes alkalmazást hoz létre, és szükségszerűen a GlassFish-t használja szerverként (4-es verzió.0). Ha a felhasználó inkább az Eclipse-t használja, akkor a Tomcat 8-at kell választania. Így definiálnak egy myserver nevű csomagot, és létrehoznak benne egy WebSocket szerver osztályt. A szerver megvalósításának kódja meglehetősen olvasható, és viselkedése könnyen érthető.

A webes aljzatok példánya a Java-ban

A webes aljzat előnyei

A WS számos problémát megold a REST vagy a HTTP segítségével. A HTTP egy egyirányú protokoll, amelyben az ügyfél mindig kérést kezdeményez. A kiszolgáló feldolgozza és visszaadja a választ, majd az ügyfél használja. A Websocket egy kétirányú protokoll, amely nem rendelkezik előre meghatározott üzenetmintákkal, például kérés/válasz. Az ügyfél vagy a szerver üzenetet küldhet a másik félnek.

A HTTP lehetővé teszi, hogy a kérés üzenet az ügyféltől a kiszolgálóig menjen, majd választ küld. Egy bizonyos időpontban az ügyfél kommunikál a szerverrel, vagy fordítva. Általában egy új TCP-kapcsolatot kezdeményeznek egy HTTP-kérelemhez, majd megszakítják miután megkapta válasz. Új TCP kapcsolatot kell létrehozni egy másik HTTP kéréshez/válaszhoz.

WS esetén a HTTP-kapcsolat a szokásos frissítési mechanizmus segítségével frissül. Az ügyfél és a kiszolgáló ugyanazon a TCP-kapcsolaton keresztül cserél adatokat a WS-kapcsolat életciklusán belül.

A Websocket egy alacsony szintű protokoll. Minden, beleértve egy egyszerű kérés / válasz sablont, a szükséges erőforrások és állapotkódok létrehozásának, frissítésének, törlésének módját. Ezek mind gondosan meghatározott HTTP.

A WS egy állapot nélküli protokoll, míg a HTTP egy állapot nélküli protokoll.

Scale scale ws kapcsolatok függőlegesen egyetlen szerveren, míg a HTTP vízszintesen méretezhető. Számos szabadalmaztatott megoldás létezik a vízszintes méretezéshez, de ezek nem szabványokon alapulnak.

A HTTP számos más előnnyel jár, mint például a gyorsítótár, az Útválasztás és a multiplexelés. Mindezt a WebSocket és a Java adatbázis tetején kell meghatározni.

Cikkek a témában