緲昏瘧:icess http://blog.matrix.org.cn/page/icess聽璁ㄨ

AJAX, AJAX, AJAX

濡傛灉浣犲惉璇磋繃聽GWT,閭ｄ箞浣犱竴瀹氫篃鍚榪囧畠鐨勪竴涓牳蹇冪壒鎬у氨鏄?AJAX聽鏀寔.鍦?GWT涓? the "X" part,鍦ㄥ鎴風鍜屾湇鍔″櫒绔潵鍥炰紶閫掓暟鎹? 璇ュ姛鑳芥槸閫氳繃RPC (Remote Procedure Call) 鏈哄埗瀹炵幇鐨勮€屼笉鏄嬌鐢?XMLHttpRequest object.

涓嶇榪欎簺,浣犳兂鍦ㄦ湇鍔″櫒绔仛浠€涔堟槸鏈変綘鍐沖畾鐨? Google縐板畠涓?Server Agnostic".

璁╂垜浠湅鐪嬪浣曟坊鍔?AJAX聽鏂瑰紡鐨勫紓姝ラ€氫俊鍒版垜浠殑紼嬪簭涓?

Asynchronous Communication in Hosted Mode

鍦ㄤ笅涓樁孌典腑,鎴戜滑灝嗘敼鍙樿紼嬪簭鐨勭幆澧?鎴戜滑娣誨姞涓€涓敤鎴峰彲浠ヨ緭鍏ュ鍚嶇殑鏂囨湰鍩?涓€鏃︽寜閽鐐瑰嚮浜?璇鋒眰灝嗕細鍙戦€佸埌鏈嶅姟鍣ㄧ.鏈嶅姟鍣ㄥ皢榪斿洖鍑虹幇鍦ㄥ脊鍑虹獥鍙ｇ殑娑堟伅.涓轟簡璺熻釜璇鋒眰鍜屽搷搴?鎴戜滑娣誨姞涓€涓枃鏈爣絳炬潵鏄劇ず璇鋒眰鐨勭姸鎬?

涓轟簡鍦ㄦ湇鍔″櫒鍜屽鎴風浼犻€佹暟鎹?鎴戜滑浣跨敤涓や釜Java beans. 聽鈥撀犱竴涓妸鏁版嵁甯﹀洖鏈嶅姟鍣ㄧ,涓€涓妸鍝嶅簲甯﹀洖瀹㈡埛绔? .

Client-Side Coding

28.聽鍦↗avaSource涓垱寤轟竴涓?demo.gwt.client.EventData 綾?鍐呭濡備笅:

package demo.gwt.client;

import org.ajax4jsf.gwt.client.GwtFacesEvent;

public class EventData extends GwtFacesEvent {
String name;

public String getName() {
return name;
}

public void setName(String name) {
this.name = name;
}

}

鐢ㄦ潵鍦ㄥ鎴風鍒版湇鍔″櫒绔紶閫佹暟鎹殑綾?鍙戦€佷簨浠?搴旇緇ф壙 G4jsf鐨劼燝wtFacesEvent綾?

29.聽鍒涘緩鍙﹀涓€涓被 demo.gwt.client.ResultGreeting.

鍐呭濡備笅:

package demo.gwt.client;

import org.ajax4jsf.gwt.client.GwtFacesResult;

public class ResultGreeting extends GwtFacesResult {
String greetingText;

public String getGreetingText() {
return this.greetingText;
}

public void setGreetingText(String greetingText) {
this.greetingText = greetingText;
}
}
聽

浠庢湇鍔″櫒绔甫鏉ュ搷搴旂殑綾誨簲璇ョ戶鎵縂4jsf鐨?GwtFacesResult 綾?

聽GwtFacesEvent 鍜孏wtFacesResult 閮藉疄鐜頒簡 聽com.google.gwt.user.client.rpc.IsSerializable 鎺ュ彛,鐢ㄦ潵搴忓垪鍖栧湪瀹㈡埛绔拰鏈嶅姟鍣ㄧ浼犻€掔殑琚獹WT浣跨敤鐨勬暟鎹?

璁╂垜浠洿鏂版垜浠殑widget 綾?

30. 鎵撳紑demo.gwt.client.HelloWidgetEntryPoint 浣跨敤涓嬮潰浠ｇ爜鏇挎崲瀹?

package demo.gwt.client;

import java.util.Map;

import org.ajax4jsf.gwt.client.ComponentEntryPoint;
import org.ajax4jsf.gwt.client.GwtFacesServiceAsync;

import com.google.gwt.user.client.Element;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.rpc.AsyncCallback;
import com.google.gwt.user.client.ui.Button;
import com.google.gwt.user.client.ui.ClickListener;
import com.google.gwt.user.client.ui.HorizontalPanel;
import com.google.gwt.user.client.ui.Label;
import com.google.gwt.user.client.ui.TextBox;
import com.google.gwt.user.client.ui.Widget;

/**
* Entry point classes define <code>onModuleLoad()</code>.
*/
public class HelloWidgetEntryPoint extends ComponentEntryPoint {
Label status;
TextBox input;
protected Widget createWidget(final String id) {

Map m = getWidgetParams(id);
final String buttonLabel = (String) m.get("buttonLabel");


HorizontalPanel panel = new HorizontalPanel();


input = new TextBox();
status = new Label("Loaded.");

final GwtFacesServiceAsync service = createFacesService(id);

final AsyncCallback callback = new AsyncCallback() {
public void onSuccess(Object result) {
if (null != result) {
status.setText("Loaded");
String greeting =聽 ((ResultGreeting)result).getGreetingText();
Window.alert(greeting);
} else {
status.setText("Request finished, but the result is empty");
}
}

public void onFailure(Throwable caught) {
status.setText("Error call :" + caught.getMessage());
}
};
Button btn = new Button(buttonLabel, new ClickListener() {
public void onClick(Widget sender) {
EventData eventData = new EventData();
eventData.setName(input.getText());
service.sendEvent(eventData, callback);
status.setText("Loading...");聽聽聽聽聽
聽聽聽聽聽 }
});


panel.add(input);
panel.add(btn);
panel.add(status);
return panel;
}
}

榪欓噷鏈?涓噸瑕佺殑閮ㄥ垎.1.緇勪歡鐨勫竷灞€.鎴戜滑鍒涘緩浜嗕竴涓按騫抽潰鏉?鐒跺悗娣誨姞浜嗕竴涓猧nput box,button,鍜宼ext label.

2.澹版槑浜嗗紓姝ユ湇鍔″拰浜嬩歡,瀹冪戶鎵胯嚦寮傛妯″瀷鐨凙JAX璇鋒眰.

...
final GwtFacesServiceAsync service = createFacesService(id);
...
Button btn = new Button(buttonLabel, new ClickListener() {
public void onClick(Widget sender) {
EventData eventData = new EventData();
eventData.setName(input.getText());
service.sendEvent(eventData, callback);
status.setText("Loading...");聽聽聽聽聽
聽聽聽聽聽 }
});
...
:

聽

鎴戜滑娣誨姞ClickListener 鍒癰utton涓? 褰?On Click 浜嬩歡鍙戠敓鏃?鎴戜滑鍒涘緩騫朵笖浣跨敤杈撳叆鐨勬暟鎹～鍏?聽EventData bean聽鐒跺悗浣跨敤寮傛鏈嶅姟鍙戦€佽浜嬩歡.鍦ㄤ唬鐮佺殑緇勫悗涓€琛?鎴戜滑璁劇疆text label鐨勬枃鏈負 "Loading鈥?,鍥犳鍦?聽AJAX request 寮€濮嬬殑鏃跺€?鐢ㄦ埛鍙互鐪嬪埌鍙樺寲 .

3.鍙戦€佷簨浠?鎴戜滑娉ㄥ唽浜嗕竴涓洖璋冨嚱鏁?聽

.........
.........
final AsyncCallback callback = new AsyncCallback() {
public void onSuccess(Object result) {
if (null != result) {
status.setText("Loaded");
String greeting =聽 ((ResultGreeting)result).getGreetingText();
Window.alert(greeting);
} else {
status.setText("Request finished, but the result is empty");
}
}

public void onFailure(Throwable caught) {
status.setText("Error call :" + caught.getMessage());
}
};
...........
...........

Callback 鏄?Google toolkit涓瑼syncCallback聽 綾葷殑涓€涓帴鍙?鎴戜滑瀹炵幇浜嗕袱涓柟娉?onSucess and onFailure. 鍦╫nSuccess鎯呭喌涓? 鎴戜滑娣誨姞浜嗕竴涓檮鍔犵殑媯€嫻嬪埌鏉ョ殑緇撴灉.濡傛灉鎴戜滑娌℃湁鍙楀埌涓€涓湡鏈涚殑綾?鎴戜滑鏍囪鍦ㄧ姸鎬佹枃鏈腑.聽

鐜板湪鎴戜滑瀹屾垚浜嗗鎴風鐨勪唬鐮?濡傛灉浣犱嬌鐢?聽Hosted Mode (with the "ant shell" command)鏉ュ惎鍔ㄧ▼搴?聽浣犲皢鐪嬪埌 "Request finished, but the result is empty", 鍥犱負鎴戜滑榪樻病鏈夊啓鏈嶅姟鍣ㄧ浠ｇ爜.

Server-Side Coding

鍦℉osted Mode涓殑鏈嶅姟鍣ㄧ浠ｇ爜, 鍦╯erver鍖呬腑鐨勪竴涓被鎵紨浜嗕竴涓噸瑕佽鑹?

31. 鎵撳紑JavaSource涓殑demo.gwt.server.MockHelloWidget java 鏂囦歡.

聽sendEvent 鍑芥暟澶嶆潅鍙戦€佸搷搴斿埌瀹㈡埛绔?

32. 鎶妔endEvent鍑芥暟鏇挎崲涓轟笅闈㈢殑鍐呭.:

public GwtFacesResult sendEvent(GwtFacesEvent event){

聽聽聽聽聽聽聽 ResultGreeting result = new ResultGreeting();
聽聽聽聽聽聽聽 result.setGreetingText( "Hello " +
((EventData)event).getName() );
聽聽聽聽聽聽聽聽聽聽聽聽聽聽 return result;
}
聽

33. 瀵煎叆闇€瑕佺殑綾?

import demo.gwt.client.ResultGreeting;
import demo.gwt.client.EventData;

The parameter of the method points to the event content that came from the client. What we do here is create the Result bean filling it with a greeting message and then returning.

34.鍦℉osted Mode涓惎鍔╝nt:

Adding JSF Listeners for Run-Time Mode

澶勭悊JSF鐨勪簨浠跺拰Hosted Mode鐨勪唬鐮佸樊涓嶅. 瀹㈡埛绔唬鐮佷笉鍙?鍦ㄦ湇鍔″櫒绔?,聽G4jsf浣跨敤 JSF聽鐩戝惉鍣ㄦ満鍒舵潵澶勭悊 Ajax events.

35.聽鎵撳紑 WebContent/pages/Base.xhtml騫舵坊鍔犵洃鍚櫒緇勪歡澹版槑.

<widget:component id="main" buttonLabel="#{bundle.buttonLabel}"
greeting="Hello #{greetingBean.name}!" >
聽聽 <gwt:gwtListener method="#{greetingBean.takeGreeting}"
聽聽 event ="demo.gwt.client.EventData"/>
</widget:component>
聽

聽聽gwtListener 鍏冪礌鏈変袱涓睘鎬? "method"浣跨敤JSFEL鎸囧悜澶勭悊鍣?"event"鐢ㄦ潵瀹氫箟浜嬩歡綾誨瀷.聽浜嬩歡綾誨瀷鏄被鐨勫叏闄愬畾鍚?.鏈€鍚庝竴姝ユ槸瀹炵幇璇ュ嚱鏁?

36. 鎵撳紑demo.gwt.app.GreetingBean娣誨姞涓嬮潰鐨勪唬鐮?

public ResultGreeting takeGreeting(EventData event) {
name = event.getName();
ResultGreeting result = new ResultGreeting();
result.setGreetingText("Hello " + name + " from JSF!");
return result;
}
聽

37. 鍜岄渶瑕佸鍏ョ殑綾?

import demo.gwt.client.ResultGreeting;
import demo.gwt.client.EventData;

璇ュ嚱鏁扮殑絳懼悕(signature聽 )寰堝鏄撹浣?璇ュ嚱鏁頒嬌鐢ㄦ潵鑷簬瀹㈡埛绔殑浜嬩歡浣滀負浠栫殑鍞竴涓€涓弬鏁?榪斿洖鍊間負 鐢ㄦ潵榪斿洖緇撴灉鐨勪簨浠剁被鍨?type of the method equals is just the type of the class used to return the result).鍦ㄨ繖涓嚱鏁頒腑,鎴戜滑鍚堟垚鍝嶅簲鏁版嵁騫朵笖榪斿洖瀹?

38. 鍒涘緩war鏂囦歡,閮ㄧ講瀹?

濡傛灉浣犲惎鍔ㄦ湇鍔″櫒,鍙互鐪嬪:

The Last Word

灝卞浣犵湅鍒扮殑,閫氳繃G4JSF浣跨敤涓ょ浜掕ˉ鐨勬妧鏈?GWT and JSF)鍙互鍋氬緢澶氭紓浜殑浜嬫儏. 浣嗘槸,浠嶇劧榪樻湁寰堝涓滆タ鍙互榪涗竴姝ユ坊鍔犲埌G4jsf涓?浣滀負涓€涓紑婧愰」鐩? , G4jsf渚濋潬涓€涓紑婧愮ぞ鍖烘潵鏀寔鍜屽紑鍙戝畠.濡傛灉浣犲彧鏄嬌鐢ㄥ畠,閭ｆ槸寰堝ソ鐨?浣嗘槸浣犱篃鍙互鍔犲叆鍒癎4JSF紺懼尯涓潵, 甯姪G4JSF璁╀粬鍋氱殑鏇村ソ. 聽Come visit us at:

https://ajax4jsf.dev.java.net

About the Author

Sergey Smirnov is Senior Product Manager at Exadel where he oversees the development of major products including Exadel Visual Components Platform and Exadel Studio. He has more than 15 years of in-depth development experience, primarily in the area of Web applications. His experience with JSF goes back to the very early days. For two years, he has served as a member of the JSF expert group. In addition to this, he manages a site for JSF-related resources, www.jsftutorials.net. Finally, Sergey is the co-lead of the open source project Ajax4jsf (https://ajax4jsf.dev.java.net). He can be reached at ssmirnov@exadel.com.

鍐伴洦 2006-09-07 08:32 鍙戣〃璇勮

]]>