15. září 2007

OpenAjax Hub = javascriptový messaging v 5kB

Dneska si ještě více rozšíříme znalosti na poli AJAX technologií. Z blízka se podíváme na OpenAjax Hub z pod pokličky OpenAjax Alliance. V podstatě jde o messaging pro JavaScript napsaný v JavaScriptě, nebo o jednoduchý, ale mocný, publish/subscribe hub.

Pokud děláte AJAX aplikace, které jsou složené z komponent, jenž si mezi sebou posílají události, pak čtěte dále. Pokud použijeme comet, pak komponentou může být i server (jak na to je popsáno v DWR a Jetty = výkoný AJAX naruby). Obzvláště výhodné je použití OpenAjax Hubu v případech, kdy jedna komponenta generuje události, které přijímá více komponent. Navíc hub sebou nese nezávislost jednotlivých komponent, tj. komponenty komunikují pouze s hubem a ne mezi sebou, tj. čím více komponent, tím větší zjednodušení.

My jsme měli např. problém v naší aplikaci, která sleduje pohyb autobusů (autobus se ohlašuje pomocí GPRS a posílá svou polohu získanou z GPS). Chtěli jsme polohu zobrazit nejenom v mapě, ale také pomocí tabulky, která by zobrazovala další informace (např. zda jede na čas, jak je daleko na své trase).

Jak Hub použít


Pokud se proklikáte na sourceforge stránky projektu a stáhnete si OpenAjax Hub možná budete překvapeni, protože soubor OpenAjax.js, který obsahuje implementaci Hubu má plných 5744 B. Ano není to překlep, méně než 6 kB.

Nejprve začnu serverovou částí, kde použijeme Reverse AJAX. Oproti příspěvku s chatem, kde jsme volali funkci newMsg(msg) budeme volat funkci OpenAjax.hub.publish("bus.location", busLocation) (použijeme k tomu objekt ScriptBuffer jako minule). Jako první parametr do funkce publish předáme jméno události a druhým parametrem je samotná událost (využijeme DWR, které převede java objekt do javasriptového).

Na klientu musíme zapnout reverse Ajax v DWR. Dále se zaregistrujeme k odběru událostí, což provedeme kódem:

var subscription = OpenAjax.hub.subscribe("bus.location", showBusLocationInMap);

Prvním parametrem je jméno události. Pokud se chceme přihlásit k odběru všech událostí týkajících se autobusů, pak použijeme wildcard a zapíšeme jméno události bus.*. To znamená i bus.state nebo bus.message. Pokud se chceme přihlásit i k odběru bus.data.check pak použijeme bus.**.
Druhým parametrem je callbak funkce, kterou si popíšeme dále. Dalšími parametry, které v příkladu nevyužíváme jsou:
  • scope - objekt, který bude this při volání callbacku (je-li null, pak je použit objekt window)
  • subscriberData - objekt, který je předán callback funkci jako parametr
  • filter - funkce, která vrací true/false v případě, že akceptujeme/odmítáme předanou událost
Návratovou hodnotou funkce subscribe je objekt, který se použije jako parametr při volání unsubscribe.

Callback bude mít následující podobu:

function showBusLocationInMap(name, event, subscriberData) {
//změň polohu autobusu na mapě - data jsou v objektu event
}

Nemůžu se stále ubránit dojmu, že je to geniální. Skvělý nápad, skvělá implementace, velmi jednoduché použití.

Závěr


Dneska jsem vám ukázal co to je OpenAjax Hub. Jak jej použít pro distribuci událostí na principu publish / subscribe. Ve spolupráci s DWR a jeho reverse AJAX implementací jsme navíc velmi jednoduše vytvářeli události na serveru.

To co je ESB pro distribuované systémy, to je OpenAjax Hub pro AJAX aplikace. Pokud tvoříte portálová řešení, mashupy, či složitější aplikace, pak se vám zjednodušení vnitřní komunikace, které vám nabízí OpenAjax Hub bude určitě hodit.

Odkazy


Žádné komentáře: