Lekce 3 - Úvod do JavaServer Faces (JSF)
Tento obsah je dostupný zdarma v rámci projektu IT lidem.Vydávání, hosting a aktualizace umožňují jeho sponzoři.
V minulém dílu tutoriálů o Java EE, Úvod do webových aplikací v JavaEE, jsme si udělali úvod do JavaEE a představili rychle technologie, které se v ní používají. V této větvi seriálu budeme používat technologii JSF. Dnes si v ní vytvoříme první jednoduchý projekt, na kterém si vysvětlíme základní principy. Půjde o webový generátor náhodných čísel.
Vytvoření projektu
V NetBeans vytvořte nový projekt z kategorie Java Web typu Web Application. Pokud vám tato kategorie projektů v NetBeans chybí, nainstalujte si verzi pro Javu EE nebo doinstalujte pluginy "Java EE base", "JSF" a "EJB and EAR" přes Tools -> Plugins.
Projekt pojmenujeme JSFNahodneCislo. V následujícím dialogu vybereme jako server GlassFish Server. Pokud ještě nemáte nainstalovaný server, přidejte ho pomocí tlačítka Add, kde ho poté stáhnete a nainstalujete.
Na posledním oknu zaškrtneme, že chceme využívat JavaServer Faces a potvrdíme.
NetBeans nám jako obvykle vygeneruje základní kostru projektu. Důležitý
pro nás bude zejména soubor index.xhtml, ve kterém se
vygeneroval následující obsah:
<?xml version='1.0' encoding='UTF-8' ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://xmlns.jcp.org/jsf/html"> <h:head> <title>Facelet Title</title> </h:head> <h:body> Hello from Facelets </h:body> </html>
Vidíme, že stránka je XML dokument. O XML jsme si již říkali v sekci Práce se soubory v Javě. Místo HTML budeme stránku tvořit v XHTML, které je téměř stejné, jen musíme uzavírat i nepárové tagy.
Co je zajímavé jsou jmenné prostory. Víme, že XML je univerzální jazyk, do kterého lze jednoduše dodat značky z různých balíčků. Ve vygenerovaném dokumentu se nastavuje výchozí jmenný prostor na http://www.w3.org/1999/xhtml, což jsou klasické XHTML značky pro tvorbu stránek (např. h1, table a podobně). Kromě tohoto jmenného prostoru však v dokumentu povolujeme značky i z prostoru http://xmlns.jcp.org/jsf/html, kde nalezneme právě JSF značky. Elementy z tohoto jmenného prostoru jsou vždy před vyrenderováním stránky nahrazeny dynamickým obsahem.
V příkladu je vidíme použité v head a body. Hlavička a tělo stránky se před vykreslením tedy ještě zpracovávají Javou, v našem případě tohoto mechanismu nevyužijeme, ale v budoucích aplikacích budeme díky tomu moci spojit hlavičky a těla stránek ve chvíli, kdy vkládáme podstránku do šablony.
Když aplikaci nyní spustíme, po chvíli načítání serveru se nám zobrazí následující stránka:
CDI bean
Aplikace v JEE skládáme z tzv. beanů, které budeme chápat jako komponenty.
Vytvoříme si tzv. managed bean. To je třída, jejíž instance spravuje JSF, vytváří je podle potřeby a hlavně jejich vlastnosti a metody propojuje s komponentami na webové stránce. Z tohoto důvodu označení managed, JSF řídí životní cyklus těchto beanů a stejně tak na nich volá metody.
V projektu si vytvoříme nový package s názvem beans a do něj přidáme
nový JSF ManagedBean s názvem GeneratorBean.
Vygeneruje se nám třída s následujícím obsahem (jako vždy jsem vynechal jmenné prostory):
@Named(value = "generatorBean") @Dependent public class GeneratorBean { public GeneratorBean() { } }
Vidíme, že managed bean je běžná třída s bezparametrickým konstruktorem (aby ji mohlo JSF vytvořit) a s dvěma anotacemi.
Používáme mechanismus CDI bean, CDI označuje Contexts and Dependency Injection (kontexty a injekce závislostí), dále v kurzu si ukážeme ještě jaké výhody tato technologie přináší.
Starší verze NetBeans generovaly anotaci
@ManagedBean, která je dnes již zastaralá.
První anotace @Named nám jednoduše pojmenuje naši
třídu.
Druhá anotace @Dependent označuje kdy má instance třídy
existovat. my ji přepíšeme na @RequestScoped (lze to zvolit i
při generování beanu). To znamená, že se instance vytvoří po zaslání
požadavku na stránku a po vygenerování stránky zanikne. Dále můžeme
použít např. @SessionScoped, kde instance přežívá mezi
požadavky pro jednoho klienta.
Anotace jsou z jmenných prostorů javax.inject.Named a
javax.enterprise.context.RequestScoped. Je důležité, abyste
používali právě anotace z těchto prostorů, ověřte si to.
Může se stát, že NetBeans nebudou schopné najít anotaci
@Named. To bude z důvodu, že chybí knihovna
Java EE Web 8 API Library. V takovém případě je potřeba,
abyste tuto knihovnu dodali ručně do projektu. NetBeans nám naštěstí vše
usnadňuje a tuto knihovnu má pro nás již připravenou k použití. Stačí
ji tedy jen přidat do seznamu použitých knihoven. Ve stromu projektu klikneme
pravým tlačítkem na položku Libraries a zvolíme v
kontextovém menu možnost: Add library. Zobrazí se nám
následující obrázek. Zde vybereme potřebnou knihovnu -
Java EE Web 8 API Library a stiskem tlačítka Add library
přidáme knihovnu do seznamu závislostí. Tím by se měla vyřešit neznámá
anotace javax.inject.Named.
Třídě vložíme jediný privátní atribut generator typu
Random. V konstruktoru v něm založíme novou instanci. Dále
přidáme getter, který vrátí vždy další náhodné číslo z generátoru.
Třída vypadá asi takto:
@Named(value = "generatorBean") @RequestScoped public class GeneratorBean { private Random generator; public GeneratorBean() { generator = new Random(); } public int getCislo() { return generator.nextInt(100); } }
EL výrazy
Přesuneme se do index.xhtml. Do této šablony nyní vypíšeme
výsledek metody getCislo() na GeneratorBean. Za
tímto účelem použijeme tzv. EL výrazy (Expression
Language). Pomocí nich můžeme ze šablon přistupovat k datům z
JavaBeans.
index.xhtml upravíme do následující podoby:
<?xml version='1.0' encoding='UTF-8' ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://xmlns.jcp.org/jsf/html"> <h:head> <title>Náhodné číslo</title> </h:head> <h:body> <h1>Náhodné číslo</h1> <p style="font-size: 2em;"> #{generatorBean.cislo} </p> </h:body> </html>
V odstavci používáme EL výraz, který zapíšeme pomocí hash-kříže a složených závorek. Vypisujeme vlastnost cislo na instanci generatorBean (s malým počátečním písmenem).
JSF výraz přeloží tak, že vytvoří instanci třídy GeneratorBean a na
ni zavolá getter getCislo(), jehož výstup vloží do kódu
výsledné HTML stránky. Vidíme, že nám JSF značně zjednodušuje život,
pokud znáte MVC architekturu, tak v podstatě zautomatizovalo kontroler, který
propojuje šablony s logickými třídami. Staráme se tedy již jen o tyto 2
vrstvy a zbytek se děje automaticky.
Když aplikaci spustíme, uvidíme následující HTML stránku:
Po obnovení dostaneme vždy další náhodné číslo, jelikož je bean RequestScoped (žije jen v době vykonávání požadavku).
Projekt je níže ke stažení. Příště, v lekci Zpracování formulářů v JSF, si vytvoříme jednoduchou kalkulačku a naučíme se zpracovávat formuláře.
Stáhnout
Staženo 386x (8.09 MB)
Aplikace je včetně zdrojových kódů v jazyce java
Autor sítě se informační technologie naučil na Unicorn College - prestižní soukromé vysoké škole IT a ekonomie. 
Komentáře
Zobrazeno 10 zpráv z 10.