3. díl - Úvod do JavaServer Faces (JSF)

Java Enterprise Edition Úvod do JavaServer Faces (JSF)

V minulém dílu tutoriálů o Java EE 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 JavuEE nebo doinstalujte plugin "Java Web and EE" přes Tools -> Plugins.

Nový projekt pro JEE v NetBeans

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.

GlassFish server v NetBeans

N posledním oknu zaškrtneme, že chceme využívat JavaServer Faces a potvrdíme.

JavaServer Faces v NetBeans

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:

Hello World projekt v Java JSF

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.

Managed bean v JSF

Vygeneruje se nám třída s následujícím obsahem (jako vždy jsem vynechal jmenné prostory):

@ManagedBean
@RequestScoped
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.

Anotace @ManagedBean označuje, že se jedná o managed bean a že JSF může řídit instance třídy. Ačkoli NetBeans stále generuje toto schéma, je anotace @ManagedBean zastaralá a proto ji přepíšeme na @Named. Místo managed beans používáme jiný, modernější mechanismus, tzv. CDI bean, který však funguje úplně stejně. CDI označuje Contexts and Dependency Injection (kontexty a injekce závislostí), dále v seriálu si ukážeme ještě jaké výhody tato technologie přináší.

Druhá anotace @RequestScoped označuje kdy má instance třídy existovat. @RequestScoped 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.enterpri­se.context.Re­questScoped. Je důležité, abyste používali právě anotace z těchto prostorů, ověřte si to.

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
@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.html. 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:

Webová aplikace náhodné číslo v Java Enterprise JSF

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ě si vytvoříme jednoduchou kalkulačku a naučíme se zpracovávat formuláře.


 

Stáhnout

Staženo 307x (24.55 kB)
Aplikace je včetně zdrojových kódů v jazyce java

 

  Aktivity (1)

Článek pro vás napsal David Čápka
Avatar
Autor pracuje jako softwarový architekt a pedagog na projektu ITnetwork.cz (a jeho zahraničních verzích). Velmi si váží svobody podnikání v naší zemi a věří, že když se člověk neštítí práce, tak dokáže úplně cokoli.
Unicorn College Autor se informační technologie naučil na Unicorn College - prestižní soukromé vysoké škole IT a ekonomie.

Jak se ti líbí článek?
Celkem (3 hlasů) :
55555


 


Miniatura
Všechny články v sekci
Java Enterprise Edition (JEE)
Miniatura
Následující článek
Zpracování formulářů v JSF

 

 

Komentáře

Avatar
adder
Člen
Avatar
adder:

a co když budu mít ve třídě víc getterů? zavolají se také automaticky? je k tomu potřeba znát MVC architekturu(nemám ponětí, co to je)? děkuji za odpovědi

Odpovědět 30.3.2014 9:36
I’m going to lay this brick as perfectly as a brick can be laid.
Avatar
David Čápka
Tým ITnetwork
Avatar
Odpovídá na adder
David Čápka:

Gettery se volají podle jejich názvu. Když v EL použiješ proměnnou cislo, zavolá si na pozadí getCislo() a podobně.

Odpovědět 30.3.2014 10:42
Miluji svou práci a zdejší komunitu, baví mě se rozvíjet, děkuji každému členovi za to, že zde působí.
Avatar
javakoder1
Člen
Avatar
javakoder1:

Ahoj, když najedu na localhost:8080 tak vyjede alert a t chce to po mě uživatelské jméno a heslo. Já ale v nastavení žádné jméno a heslo nemám. Prostě to nechápu díky.

 
Odpovědět 13.4.2014 18:54
Avatar
ucenidolazni
Člen
Avatar
ucenidolazni:

Toto je opravdu úžasná stránka, děkuji moc ! :-)

 
Odpovědět 13.5.2014 16:46
Avatar
srdosm
Člen
Avatar
srdosm:

Já s tím mám nějak problém. Číslo se nechce zobrazit. Stránka se zobrazuje v pohodě, ale to číslo ne...

 
Odpovědět 16.9.2015 21:46
Avatar
malybobor123
Člen
Avatar
malybobor123:

Mám s tým problém. Všetko funguje, ale nezobrazí sa mi číslo, len text "Náhodné číslo " ale čislo nie je nikde..kde je chyba?? mám to presne ako je to tu

 
Odpovědět 14.10.2015 22:20
Avatar
malybobor123
Člen
Avatar
Odpovídá na srdosm
malybobor123:

Vyriešil som ten problém. Problém je, že on používa GlassFish 4.0 a ja, tak ako srdosm pravdepodobne 4.1 a nepzná to javax.enterpri­se.context.Re­questScoped, namiesto toho používa javax.faces.be­an.RequestSco­ped. Neviem aký je rozdiel medzi nimi a ako by mala používať, no vyriešiš to tým, že klikneš pravým na projekt JSFNahodneCis­lo/properties/li­braries/Add JAR/folder/ --nájdeš umiestenie GlassFish--/glassfish/mo­dules/cdi-api.jar ...dáš import, vymažeš import s javax.faces.be­an.RequestSco­ped frčí to

[/code]

 
Odpovědět  +2 14.10.2015 22:53
Avatar
David Tilšer:

Když chci vygenerovat novou třídu, tak tam nemám na výběr JSF ManagedBean, tak vytvořím přes new class, ale tam pak nemám @ManagedBean, @RequestScoped.
Jak to udělat? Jak mám vygenerovat JSF ManagedBean třídu?

Odpovědět 2. dubna 22:34
Odpočinek je pro slabochy.
Avatar
David Tilšer:

Tak to co jsem psal výše, tak už jsem vyřešil, ale když chci spustit výslednou aplikaci, tak mi to píše "low memory". Nechápu, mám 8GB RAM a nemám ani 1GB využité, jak je to možný? Setkal se někdo s tím?

Odpovědět 2. dubna 23:04
Odpočinek je pro slabochy.
Avatar
ludo.kovac
Člen
Avatar
ludo.kovac:

S podporou NetBeans som upravil zdroják zo JSFNahodneCislo.zip a funguje to

package beans;

import java.util.Random;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;

/*
 *             __          __                __
 *        ____/ /__ _   __/ /_  ____  ____  / /__ _________
 *       / __  / _ \ | / / __ \/ __ \/ __ \/ //_// ___/_  /
 *      / /_/ /  __/ |/ / /_/ / /_/ / /_/ / ,< _/ /__  / /_
 *      \__,_/\___/|___/_.___/\____/\____/_/|_(_)___/ /___/
 *
 *
 *      TUTORIÁLY  <>  DISKUZE  <>  KOMUNITA  <>  SOFTWARE
 *
 *      Tento zdrojový kód je součástí tutoriálů na programátorské
 *      sociální síti WWW.DEVBOOK.CZ
 *
 *      Kód můžete upravovat jak chcete, jen zmiňte odkaz
 *      na www.devbook.cz :-)
 */
@ManagedBean
@RequestScoped
public class GeneratorBean {

    /**
     * Instance generátoru
     */
    private Random generator;

    /**
     * Inicializace beanu
     */
    public GeneratorBean() {
        generator = new Random();
    }

    /**
     * Vrátí náhodné číslo
     * @return Náhodné číslo
     */
    public int getCislo()
    {
        return generator.nextInt(100);
    }

}
 
Odpovědět 19. července 10:21
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 10 zpráv z 10.