javaserver pages(jsf) 在 java 的 web 編程中已經(jīng)被認(rèn)為是下一個(gè)重大的事件。通過(guò) jsf ,你可以在網(wǎng)頁(yè)上使用 web 組件,來(lái)捕獲用戶行為產(chǎn)生的事件。不遠(yuǎn)的將來(lái),java 工具將支持這個(gè)技術(shù),開(kāi)發(fā) web 應(yīng)用程序?qū)⑴c我們現(xiàn)在開(kāi)發(fā) swing 程序類似:拖放控件、寫事件偵聽(tīng)器。本文是一個(gè) jsf 的簡(jiǎn)要介紹,并且提供一個(gè) jsf 的例子,用來(lái)展示 jsf 的事件驅(qū)動(dòng)特性。要理解本文,您需要對(duì) servlets, jsp, javabeans, 與標(biāo)簽庫(kù)有一定的理解。
首先,一個(gè) jsf 應(yīng)用就是一個(gè) servlet/jsp 應(yīng)用。它有一個(gè)配置描述符,有 jsp 頁(yè)面、客戶定制標(biāo)簽、靜態(tài)資源等等。不同的是,jsf 應(yīng)用是事件驅(qū)動(dòng)的。你通過(guò)寫一個(gè)事件偵聽(tīng)類來(lái)決定應(yīng)用程序的行為。以下建立一個(gè) jsf 應(yīng)用所需要的幾個(gè)步驟:
1、建立 jsp 頁(yè)面,用 jsf 組件包裝 html 元素。
2、寫一個(gè) javabean 用來(lái)保持用戶輸入與組件數(shù)據(jù)的狀態(tài)。
3、寫一個(gè)事件偵聽(tīng)器來(lái)決定當(dāng)某事件發(fā)生時(shí)應(yīng)該有什么反映,比如用戶點(diǎn)擊了一個(gè)按鈕或者提交了表單。jsf 支持兩個(gè)事件:actionevent 與 valuechangeevent 。actionevent 是針對(duì)用戶提交表單與點(diǎn)擊按鈕的,而 valuechangeevent 是當(dāng)一個(gè) jsf 組件改變了時(shí)觸發(fā)。
現(xiàn)在,讓我們來(lái)看一下 jsf 動(dòng)作的細(xì)節(jié)。
jsf 怎樣工作
jsp 頁(yè)面是 jsf 應(yīng)用的用戶接口。每個(gè)頁(yè)面包括一些 jsf 組件用來(lái)描述 web 控件,如表單、輸入框、按鈕等等。組件可以嵌入另一個(gè)組件中,正如輸入框可以在表單中。每個(gè) jsp 頁(yè)面就這樣表示為組件樹(shù)。javebeans 從用戶的請(qǐng)求中獲取數(shù)據(jù)并存儲(chǔ)。
這是有意思的部分:每當(dāng)用戶做任何事情,如點(diǎn)擊按鈕或者提交表單,都有事件產(chǎn)生。然后事件消息通過(guò) http 傳到服務(wù)器。在服務(wù)器端,是一個(gè)配置了叫做 faces servlet 的特殊 servlet 的 web 容器。faces servlet(javax.faces.webapp.facesservlet)是所有 jsf 應(yīng)用的引擎。每個(gè) jsf 應(yīng)用在 web 容器中都有獨(dú)立的 faces servlet 。另一個(gè)重要的對(duì)象是 javax.faces.context.facescontext , 它包括了所有關(guān)于當(dāng)前用戶請(qǐng)求的必要信息。
faces servlet 的后臺(tái)處理是相當(dāng)復(fù)雜的。然而你沒(méi)有必要了解這些細(xì)節(jié),只需要記住:faces servlet 為 jsp 頁(yè)面創(chuàng)建了組件樹(shù),對(duì)組件樹(shù)的控制又對(duì)應(yīng)著事件。faces servlet 知道怎么去創(chuàng)建組件樹(shù),因?yàn)樗呀?jīng)訪問(wèn)了當(dāng)前應(yīng)用中所有的 jsp 頁(yè)面。faces servlet 還會(huì)創(chuàng)建一個(gè) event 對(duì)象,并把它傳遞給所有注冊(cè)過(guò)的偵聽(tīng)器。你可以通過(guò)與當(dāng)前請(qǐng)求相對(duì)應(yīng)的 facescontext 得到這個(gè)頁(yè)面的組件樹(shù)。
客戶端瀏覽器上 web 控件產(chǎn)生的事件,被包含在一個(gè) http 請(qǐng)求中,放在一起還有如瀏覽器類型、請(qǐng)求地址等其它信息。因此,所有需要 faces servlet 處理的請(qǐng)求必須指向這個(gè) servlet 。那你怎樣通過(guò)調(diào)用 faces servelt 來(lái)處理每個(gè) http 請(qǐng)求呢?很容易,只需要在配置描述符里用一個(gè) servlet-mapping 元素把一個(gè)特殊的 url 式樣映射到 faces servlet。通常,你會(huì)用到 /faces/* 樣式,如下所示:
<!-- faces servlet -->
<servlet>
<servlet-name>faces servlet</servlet-name>
<servlet-class>javax.faces.webapp.facesservlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<!-- faces servlet mapping -->
<servlet-mapping>
<servlet-name>faces servlet</servlet-name>
<url-pattern>/faces/*</url-pattern>
</servlet-mapping>
請(qǐng)求地址必須包含有在 <url-pattern> 元素中描述的樣式。這個(gè)要求不容易達(dá)到。另外也需要注意的是 <servlet> 元素,它包含 faces servlet ,有一個(gè) <load-on-startup> 元素,用來(lái)確是否應(yīng)用程序第一次啟動(dòng)時(shí) servlet 是否加載。
為了捕獲組件產(chǎn)生的事件,你需要為這個(gè)組件寫一個(gè)偵聽(tīng)器,并把它注冊(cè)給這個(gè)組件。通過(guò)在表示組件的客戶端標(biāo)簽中嵌入 <action_listener> 元素能做到這一點(diǎn)。例如,為了讓一個(gè)名叫 jsfapp.myactionlistener 的事件偵聽(tīng)器,來(lái)捕獲一個(gè)名叫 submitbutton 的命令按鈕產(chǎn)生的事件,在你的 jsp 頁(yè)面中寫如下的代碼即可:
<h:command_button id="submitbutton" label="add" commandname="submit" >
<f:action_listener type="jsfapp.myactionlistener" />
</h:command_button>
一個(gè) action listener 必須實(shí)現(xiàn) javax.faces.event.actionlistener 接口,而一個(gè) value-changed listener 必須實(shí)現(xiàn) java.faces.event.valuechangedlister 接口。下面讓我們來(lái)創(chuàng)建一個(gè)簡(jiǎn)單的 jsf 應(yīng)用,以展現(xiàn) jsf 是怎么樣事件驅(qū)動(dòng)的。
一個(gè)簡(jiǎn)單的 jsf 應(yīng)用
我們將創(chuàng)建一個(gè)簡(jiǎn)單的應(yīng)用,它可以實(shí)現(xiàn)對(duì)二個(gè)數(shù)字相加。為了運(yùn)行這個(gè)應(yīng)用,你需要準(zhǔn)備 tomcat5 與 jsf v1.0 ea4(包含在 java web services developer pack (jwsdp) 1.2中)。這個(gè)應(yīng)用程序包括:
adder.jsp jsp 頁(yè)面。
numberbean 存放用戶數(shù)據(jù)的 javabean
myactionlistener 事件偵聽(tīng)器
web.xml 配置描述文件
為了使這個(gè)應(yīng)用能正常工作,還需要幾個(gè) jar 文件,包括 jsf 標(biāo)準(zhǔn)實(shí)現(xiàn)與其它類庫(kù)。如果你安裝了 jwsdp 1.2,你就可以在 jsflib 目錄下找到所需要的這些文件。把這些 .jar 文件拷貝到 web-inf/lib 目錄下。下面是整個(gè)的 .jar 與 .tld 文件列表:
jsf-api.jar 包含有 faces servlet 與其它相關(guān) javax.faces 包下面的類
jfs-ri.jar 是 jsf 的參考實(shí)現(xiàn)
jstl_el.jar
standard.jar
此外,一個(gè) jsf 的應(yīng)用還需要如下的類庫(kù),它們是 apache jakarta 項(xiàng)目的一部分:
commons-beanutils.jar
commons-digester.jar
commons-logging.jar is
以下的幾小段討論這個(gè) jsf 示例的每個(gè)部分。最后的一小段,“編譯與運(yùn)行”,解釋 jsf 應(yīng)用怎么樣運(yùn)行。
創(chuàng)建目錄結(jié)構(gòu)
首先為你的 jsf 應(yīng)用創(chuàng)建一個(gè)目錄結(jié)構(gòu)。在 tomcat 中,它在 webapps 目錄下。“圖1”描述了叫做 myjsfapp 的應(yīng)用程序的目錄結(jié)構(gòu)。
寫配置描述符
與其它的 servlet/jsp 應(yīng)用一樣,這個(gè)應(yīng)用程序也需要一個(gè)配置描述文件。如“清單1”表示。
listing 1. the deployment descriptor (the web.xml file)
<?xml version="1.0"?>
<!doctype web-app public
"-//sun microsystems, inc.//dtd web application 2.3//en"
"http://java.sun.com/dtd/web-app_2_3.dtd";>
<web-app>
<!-- faces servlet -->
<servlet>
<servlet-name>faces servlet</servlet-name>
<servlet-class>javax.faces.webapp.facesservlet</servlet-class>
<load-on-startup> 1 </load-on-startup>
</servlet>
<!-- faces servlet mapping -->
<servlet-mapping>
<servlet-name>faces servlet</servlet-name>
<url-pattern>/faces/*</url-pattern>
</servlet-mapping>
</web-app>
在這個(gè)配置描述文件中有二個(gè)部分。 <servlet> 元素注冊(cè) faces servlet , <servlet-mapping> 元素聲明任何包含有 /faces/ 式樣的請(qǐng)求地址,必須傳遞給 faces servlet 。
創(chuàng)建 jsp 頁(yè)面
一個(gè)叫做 adder.jsp 的 jsp 頁(yè)面提供用戶接口,如“清單2”所示:
listing 2. the adder.jsp page
<%@ taglib uri="http://java.sun.com/jsf/html"; prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core"; prefix="f" %>
<html>
<head>
<title>add 2 numbers</title>
</head>
<body>
<jsp:usebean id="numberbean" class="jsfapp.numberbean" scope="session" />
<f:use_faces><br />
<h:form id="addform" formname="addform" ><br />
first number:<br />
<h:input_number id="firstnumber" valueref="numberbean.firstnumber" /><br />
second number:
<h:input_number id="secondnumber" valueref="numberbean.secondnumber" /><br />
result:
<h:output_number id="output" valueref="numberbean.result"/><br>
<h:command_button id="submitbutton" label="add" commandname="submit" >
<f:action_listener type="jsfapp.myactionlistener" />
</h:command_button>
</h:form>
</f:use_faces>
</body>
</html>
我們首先定義了倆個(gè)標(biāo)簽,它用到 jsf 的兩個(gè)標(biāo)簽庫(kù):html 與 core 。這倆個(gè)標(biāo)簽庫(kù)的定義可以在 jsf-ri.jar 文件中找到,所以你不用為它擔(dān)心。它們的前綴分別是 h / f 。
<%@ taglib uri="http://java.sun.com/jsf/html"; prefix="h" %>
<%@ taglib uri="http://java.sun.com/jsf/core"; prefix="f" %>
<jsp:usebean> 這個(gè)動(dòng)作元素定義 numberbean javabean 為 session scope 。
<jsp:usebean id="numberbean" class="jsfapp.numberbean" scope="session" />
接著是 jsf 控件了。注意 jsf 控件需要嵌入到 <f:use_faces> 標(biāo)簽中:
<f:use_faces>
...
</f:use_faces>
在這里面,有一個(gè)表單。
<h:form id="addform" formname="addform">
...
</h:form>
內(nèi)嵌在這個(gè)表單里的是二個(gè) input_numbers, 一個(gè) output_number, 與一個(gè) command_button 。
第一個(gè)數(shù)字:
<h:input_number id="firstnumber" valueref="numberbean.firstnumber" /><br />
第二個(gè)數(shù)字:
<h:input_number id="secondnumber" valueref="numberbean.secondnumber" /><br />
結(jié)果:
<h:output_number id="output" valueref="numberbean.result" /><br />
<h:command_button id="submitbutton" label="add" commandname="submit">
<f:action_listener type="jsfapp.myactionlistener" />
</h:command_button>
注意命令按鈕的事件偵聽(tīng)器。“圖2”描述了這個(gè) jsp 頁(yè)面的組件樹(shù)(樹(shù)根省略)。
主組件是表單,它有四個(gè)子組件。
寫對(duì)象模型
在這個(gè)應(yīng)用中,你需要用一個(gè) javabean 來(lái)存二個(gè)數(shù)字與相加的結(jié)果。“清單3”是這個(gè) javabean 的內(nèi)容:numberbean
listing 3. the numberbean javabean
package jsfapp;
public class numberbean {
int firstnumber = 0;
int secondnumber = 0;
public numberbean () {
system.out.println("creating model object");
}
public void setfirstnumber(int number) {
firstnumber = number;
system.out.println("set firstnumber " + number);
}
public int getfirstnumber() {
system.out.println("get firstnumber " + firstnumber);
return firstnumber;
}
public void setsecondnumber(int number) {
secondnumber = number;
system.out.println("set secondnumber " + number);
}
public int getsecondnumber() {
system.out.println("get secondnumber " + secondnumber);
return secondnumber;
}
public int getresult() {
system.out.println("get result " + (firstnumber + secondnumber));
return firstnumber + secondnumber;
}
}
寫事件偵聽(tīng)器
命令按鈕的事件偵聽(tīng)器是這個(gè) jsf 應(yīng)用的最有趣的部分。它表述一個(gè)事件怎么樣引起一個(gè)偵聽(tīng)器去偵聽(tīng)。偵聽(tīng)器簡(jiǎn)單地只是輸出信息到控制臺(tái)。然而,它顯示了重要的信息,如 jsp 頁(yè)面組件樹(shù)的層次結(jié)構(gòu),正是這些組件觸發(fā)了事件。“清單4”展示事件偵聽(tīng)器:
listing 4. the action listener for the command button (myactionlistener.java)
package jsfapp;
import java.util.iterator;
import javax.faces.component.uicomponent;
import javax.faces.context.facescontext;
import javax.faces.event.actionevent;
import javax.faces.event.actionlistener;
import javax.faces.event.phaseid;
import javax.faces.tree.tree;
public class myactionlistener implements actionlistener {
public phaseid getphaseid() {
system.out.println("getphaseid called");
return phaseid.apply_request_values;
}
public void processaction(actionevent event) {
system.out.println("processaction called");
// the component that triggered the action event
uicomponent component = event.getcomponent();
system.out.println("the id of the component that fired the action event: "
+ component.getcomponentid());
// the action command
string actioncommand = event.getactioncommand();
system.out.println("action command: " + actioncommand);
facescontext facescontext = facescontext.getcurrentinstance();
tree tree = facescontext.gettree();
uicomponent root = tree.getroot();
system.out.println("----------- component tree -------------");
navigatecomponenttree(root, 0);
system.out.println("----------------------------------------");
}
private void navigatecomponenttree(uicomponent component, int level) {
iterator children = component.getchildren();
// indent
for (int i=0; i<level; i++)
system.out.print(" ");
// print component id
system.out.println(component.getcomponentid());
// navigate children
while (children.hasnext()) {
uicomponent child = (uicomponent) children.next();
navigatecomponenttree(child, level + 1);
}
}
}
編譯與運(yùn)行
為了編譯這個(gè)應(yīng)用,我們轉(zhuǎn)到 myjsfapp/web-inf/classes 這個(gè)目錄。如果你用的是 windows 系統(tǒng),打出如下命令:
javac -classpath ../lib/jsf-api.jar;../lib/jsf-ri.jar;../../../../common/lib/servlet.jar jsfapp/*.java
注意你必須用到 lib 目錄下的類庫(kù)與 servlet.jar 庫(kù)。
然后運(yùn)行 tomcat ,在地址欄輸入如下地址:
http://localhost:8080/myjsfapp/faces/adder.jsp
注意你在 jps 頁(yè)面文件名前用了 /faces/ 式樣。然后可以在瀏覽器中看到”如圖3“所示:
在控制臺(tái),你可以看到如下信息:
model object created
get firstnumber 0
get secondnumber 0
get result 0
getphaseid called
現(xiàn)在在二個(gè)輸入框中分別輸入二個(gè)數(shù)字,然后點(diǎn)擊 add 按鈕。瀏覽器將顯示計(jì)算結(jié)果“如圖4”:
更重要的,再檢查一下控制臺(tái),看到如下信息:
get firstnumber 0
get secondnumber 0
processaction called
the id of the component that fired the action event: submitbutton
action command: submit
----------- component tree -------------
null
addform
firstnumber
secondnumber
output
submitbutton
----------------------------------------
set firstnumber 10
set secondnumber 20
get firstnumber 10
get secondnumber 20
get result 30
總結(jié)
在這篇文章中,你學(xué)到了 jsf 區(qū)別于其它 servlet/jsp 應(yīng)用的最重要的特點(diǎn):事件驅(qū)動(dòng)。你也創(chuàng)建了一個(gè)包含一個(gè) jsp 頁(yè)面的簡(jiǎn)單應(yīng)用。更重要的,你寫了能響應(yīng)事件的偵聽(tīng)器。
實(shí)際應(yīng)用中的 jsf 應(yīng)用復(fù)雜得多,通常是很多 jsp 頁(yè)面。這樣情況下,你需要從一個(gè)頁(yè)面導(dǎo)航到另一個(gè)頁(yè)面。然而這應(yīng)是另一篇文章的主題。
聯(lián)系客服