WebSocket je integrální technologií v mnoha moderních webových aplikacích. Pokud píšete kód pro web, pravděpodobně jste tento termín již slyšeli, ale možná si nejste jisti, co přesně to je nebo jak jej používat. Naštěstí WebSocket není složitým konceptem a základní porozumění mu můžete získat poměrně rychle.
Co je WebSocket?
WebSocket bohužel patří mezi ty názvy, které na první pohled nedávají smysl. WebSocket je ve skutečnosti název a komunikační protokol který umožňuje obousměrnou komunikaci mezi klientem a webovým serverem.
Jednodušeji řečeno, WebSocket je technologie, která umožňuje klientovi a serveru vytvořit spojení, kde může kterákoli strana kdykoli poslat druhé straně zprávu.
To se liší od běžného HTTP připojení, kde klient musí iniciovat požadavek a teprve poté může server odeslat odpověď. WebSocket je ve skutečnosti zcela odlišný komunikační protokol než HTTP, který byl navržen tak, aby byl kompatibilní s HTTP. Když chce klientská aplikace iniciovat připojení WebSocket, musí použít mechanismus aktualizace HTTP pro přepnutí na protokol WebSocket.
V tuto chvíli si můžete myslet: "Protokol je jen soubor pravidel, jak to můžete použít ke kódování?".
Chybějící kousek se nazývá a zásobník protokolů. Zařízení, která podporují protokol, mají v podstatě zabudovaný hardware a software, který vám umožňuje psát aplikace, které komunikují pomocí protokolu. Protokol se přímo nepoužívá k sestavení čehokoli.
Proč byl vytvořen WebSocket?
Chcete-li ilustrovat potřebu WebSocket, zvažte mechanismus chatování na internetu.
Někdo odešle zprávu na server chatu ze svého zařízení, ale server musí zprávu odeslat do vašeho zařízení, než si ji budete moci přečíst. Pokud server používá HTTP, server vám nemůže přímo přeposlat tuto zprávu, protože server nemůže iniciovat požadavky.
Existuje několik způsobů, jak tento problém vyřešit pomocí HTTP. Jedním ze způsobů je, že klient neustále odesílá požadavky na aktualizaci na server a server přepošle všechna data, která má v odpovědi. Tato technika se nazývá dotazování a každý požadavek se nazývá dotazování. Existují dvě varianty dotazování: dlouhé dotazování a krátké dotazování.
Použití varianty long polling znamená, že klientské zařízení se neustále ptá serveru, zda jsou k dispozici nějaké nové zprávy. Pokud jsou k dispozici nové zprávy, server je odešle jako odpověď. Pokud ne, server by zpozdil odpověď a podržel otevřené připojení, dokud by neměl data k odeslání zpět, a pak by klient okamžitě zadal nový požadavek.
Tato technika je neefektivní, protože HTTP nebylo navrženo pro použití tímto způsobem. V malém měřítku funguje adekvátně, ale každý požadavek HTTP zahrnuje odesílání dalších dat v a má za následek výrazně zvýšené zatížení serveru, když mnoho klientů dotazuje to.
Zde je schéma znázorňující dlouhé dotazování:
Krátká varianta dotazování je ještě méně efektivní. V krátkém dotazování server neudrží připojení otevřené, dokud nejsou k dispozici nová data, což znamená, že klient musí pokračovat v dotazování serveru v pevných, velmi krátkých intervalech.
Další technika pro obousměrnou komunikaci v HTTP se nazývá streaming.
Při streamování po odeslání prvního požadavku server podrží připojení otevřené na dobu neurčitou a klientovi zasílá nové informace jako průběžné dílčí odpovědi.
Použití streamování vede k menší režii dat a zatížení serveru než dotazování, protože v ideálním případě klient zadá pouze jeden požadavek HTTP. Streamování bohužel za určitých podmínek způsobuje problémy, protože prohlížeče a síťoví zprostředkovatelé (jako proxy) se často snaží částečné odpovědi jako rozbité části jedné velké odpovědi HTTP (což je normální chování HTTP), namísto samostatných zpráv, pro které byly určeny být.
WebSocket byl vytvořen k vyřešení těchto problémů. Na rozdíl od HTTP byl WebSocket navržen speciálně pro obousměrnou komunikaci. S WebSocket, jakmile je spojení otevřeno, klient a server mohou odesílat zprávy tam a zpět bez problémů s dotazováním nebo streamováním.
Případy použití pro WebSocket
WebSocket je skvělý, ale to neznamená, že by se měl používat všude.
Implementace WebSocket může vaší aplikaci přidat složitost, zejména na straně serveru, takže by se to nemělo dělat, pokud k tomu nemáte dobrý důvod. To vyvolává otázku: jak vypadá dobrý důvod?
WebSocket je ideální pro případy použití, kde je vyžadována častá obousměrná komunikace s nízkou latencí. Jinými slovy, WebSocket poskytuje výhodu pro aplikace, které potřebují komunikovat často nebo ve velkém měřítku. Pokud komunikace nemusí probíhat v reálném čase nebo se aplikace nikdy nerozroste do velkého rozsahu, může pro použití v této aplikaci stačit dotazování nebo streamování.
Typické použití WebSocket je při vytváření chatovacích aplikací, online her pro více hráčů, softwaru pro spolupráci a oznamování v reálném čase atd.
Jak používat WebSocket na straně klienta
Používání WebSocket na straně serveru může být poměrně složité a proces se podstatně liší v závislosti na jazyku (např C#, Jáva, atd.) a knihovna dle výběru, takže se jimi zde nebudeme zabývat. Dále stručně probereme, jak používat WebSocket na straně klienta.
Všechny moderní prohlížeče implementují webové API s názvem WebSocket API, což je zásobník protokolů prohlížeče pro protokol WebSocket. Pomocí tohoto rozhraní API můžete použít WebSocket v JavaScriptu. Rozhraní API vám umožňuje vytvořit objekt WebSocket, pomocí kterého vytvoříte připojení WebSocket a komunikujete se serverem WebSocket.
K vytvoření objektu WebSocket můžete použít následující formát kódu:
let exampleSocket = new WebSocket("wss://www.example.com/socketserver", "dummyProtocol");
První argument konstruktoru je URI serveru WebSocket, se kterým chcete vytvořit připojení. Vždy bude začínat „ws“ nebo „wss“. Druhý argument je volitelný. Jeho hodnota je buď řetězec, nebo pole řetězců, které určuje podprotokoly, které podporujete.
Objekt WebSocket má vlastnost pouze pro čtení s názvem readyState. Přístup k této vlastnosti poskytuje aktuální stav připojení WebSocket. readyState má čtyři možné hodnoty: "connecting", "open", "closing" a "closed".
Po spuštění tohoto řádku kódu se prohlížeč pokusí připojit k určenému serveru. Připojení nebude dokončeno najednou, takže readyState of exampleSocket se bude „připojovat“. Dokud není spojení dokončeno, nelze odesílat ani přijímat žádné zprávy, v tomto okamžiku se hodnota readyState stane „otevřenou“.
The příkladSocket objekt má posluchač událostí (který se liší od Posluchače událostí DOM) s názvem „onopen“, který umožňuje provádět další akce až po navázání spojení. Objekt má také metodu „odeslat“, která vám umožňuje odesílat řetězce, objekty BLOB (binární data) a ArrayBuffery jako zprávy na server.
Zde je příklad použití společně:
exampleSocket.onopen = funkce (událost) {
exampleSocket.send("WebSocket je opravdu skvělý");
};
API také poskytuje způsob, jak můžete reagovat na zprávy, které server posílá. To se provádí pomocí posluchače událostí „onmessage“. Zde je příklad:
exampleSocket.onmessage = funkce (událost) {
řídicí panel.log(událost.data);
}
Místo toho můžete také psát funkce šipky:
exampleSocket.onmessage = (událost) => { řídicí panel.log (událost.data); }
API také poskytuje a zavřít() způsob uzavření spojení. Vypadá to takto:
příkladSocket.zavřít();
WebSocket umožňuje efektivní obousměrnou komunikaci
WebSocket je obousměrný komunikační protokol. Servery a prohlížeče implementují zásobníky protokolů pro komunikaci pomocí WebSocket. WebSocket existuje, protože HTTP nebyl navržen tak, aby byl obousměrný. Existují metody pro implementaci obousměrných připojení s HTTP, ale mají problémy.
WebSocket je výkonná technologie, ale není nutná ve všech případech, protože může výrazně zkomplikovat architekturu aplikace. Používání WebSocket na straně klienta se provádí pomocí rozhraní WebSocket API prohlížeče.