extjs中directjngine的配置
第一步,在web.xml中配置DirectJNgine Servlet.我配置的web.xml如下:在web.xml配置文件中寫:
<web-app version="2.5"
xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<!-- 以下為DirectJNgine servlet 默認配置-->
<servlet>
<servlet-name>DjnServlet</servlet-name>
<servlet-class>com.softwarementors.extjs.djn.servlet.DirectJNgineServlet</servlet-class>
<init-param>
<param-name>debug</param-name>
<param-value>true</param-value>
</init-param>
<init-param>
<param-name>providersUrl</param-name>
<param-value>djn/directprovider</param-value>
</init-param>
<!-- DirectJNgine servlet 默認配置-->
<!-- api域:對應下面的各個param-name的前綴,可以設置多個不同的域-->
<init-param>
<param-name>apis</param-name>
<param-value>
mynamespace
</param-value>
</init-param>
<!-- mynamespace對應上面的api域。MyAction對應生成的js相應的文件夾.服務器運行后,將在MyAction/下存放自動生成的3個js文件。這里的名稱分別為
MyActionApi.js,MyActionApi-debug.js,MyActionApi-min.js
-->
<init-param>
<param-name>mynamespace.apiFile</param-name>
<param-value>MyAction/MyActionApi.js</param-value>
</init-param>
<!-- mynamespace.對應上面的域."Ext.zhouyang"為命名空間所對應的值。會在頁面加載時候用上. -->
<init-param>
<param-name>mynamespace.apiNamespace</param-name>
<param-value>Ext.zhouyang</param-value>
</init-param>
<!-- mynamespace.對應上面的域. 要使用的類的全路徑名 -->
<init-param>
<param-name>mynamespace.classes</param-name>
<param-value>
com.softwarementors.extjs.djn.MyAction.MyAction
</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>DjnServlet</servlet-name>
<url-pattern>/djn/directprovider/*</url-pattern>
</servlet-mapping>
<welcome-file-list>
<welcome-file>
index.html
</welcome-file>
</welcome-file-list>
</web-app>
第二步,使你的服務器端方法對JavaScript可見,其實就是說對客戶端可見。
以我的demo為例,我想在hello.html中調用服務器端的方法。于是,我在hello.html中添加如下一段話。
<script type="text/javascript" src="../djn/djn-remote-call-support.js"></script>
<script type="text/javascript" src="../ejn/ejn-assert.js"></script>
<!--以上為DirectJNgine的基礎JS文件.-->
<script type="text/javascript" src="MyActionApi.js"></script>
前兩個script引用,是用來調用directjngine提供的默認的一些操作函數。只需引用即可,不需要關注太多。
最后一個js,在啟動服務器前,你是看不到的。因為它是directjngine項目,根據你的配置自動生成的。至于其中到底是怎樣,下面我會詳細介紹。
第三步,設計服務器端的方法。如函數名稱,是否需要返回值等等。因為在hello.html頁面,我將會調用方法。
具體調用代碼將在最后的hello.html代碼說明部分進行集中說明。
第四步,使用Java語言,編寫服務器端的方法。附上代碼如下:
- package com.softwarementors.extjs.djn.MyAction;
- import com.softwarementors.extjs.djn.config.annotations.DirectMethod;
- public class MyAction {
- @DirectMethod
- public String doEcho(String parm)
- {
- return "參數是" + parm;
- }
- @DirectMethod
- public String doShow()
- {
- return "i am not easy";
- }
- }
@DirectMethod這個標簽很重要,就是通過這個標簽和web.xml的一些配置,才會動態生成第二步中需要引入的js。這種書寫方式下, 你在Java代碼中書寫的方法名稱就是你在前臺JS調用的方法名稱。如果你覺得這樣子不安全,或是不專業。那么可以通過定義別名的方法對方法進行訪問。書 寫形式如下:
@DirectMethod( method="nameyouwant")
這樣子定義之后,前臺JS調用服務器端方法時,方法的名稱就是你紅色定義的名稱了。
把類編譯好后,把class文件放入WEB-INF\classes相應的包目錄下。要與web.xml中class文件的包的目錄結構相同。
第五步,告訴DirectJNgine 去哪里尋找服務器端的方法。
在web.xml的配置中,有如下代碼:
<param-name>mynamespace.classes</param-name>
<param-value>
com.softwarementors.extjs.djn.MyAction.MyAction
</param-value>
</init-param>
在這里需要注意,mynamespace.classes的紅色部分,一定要與web.xml上面的apis變量的mynamespace相同。
其次,com.softwarementors.extjs.djn.MyAction.MyAction 為第四步中書寫的類的全路徑名稱,如果有多個類,則用英文逗號分隔。
第六步,為了讓Extjs可以調用我們的服務器端方法,我們需要注冊一個遠程調用提供者即a remoting provider。你需要做的就是在hello.html代碼中,加入如下語句,為某一個空間注冊一個遠程調用提供者:
Ext.zhouyang.REMOTING_API.enableBuffer = 0;
Ext.Direct.addProvider(Ext.zhouyang.REMOTING_API);
注意:上面的Ext.zhouyang為在web.xml變量中mynamespace.apiNamespace已經定義。
第七步,通過JavaScript進行調用服務器端的方法。
var t = e.getTransaction();
if(e.status){
out.append(
String.format('<p><b>Successful call to {0}.{1} with response:</b><xmp>{2}</xmp></p>',
t.action,
t.method,
Ext.encode(result)));
}else{
out.append(
String.format('<p><b>Call to {0}.{1} failed with message:</b><xmp>{2}</xmp></p>',
t.action,
t.method,
e.message));
}
out.el.scroll('b', 100000, true);
});
//doEcho函數,此函數有參數。
var parm = txtparm.value; //要傳入后臺的參數
MyAction.doEcho(parm, function(result, e){
var t = e.getTransaction();
if(e.status){
out.append(String.format('<p><b>Successful call to {0}.{1} with response:</b><xmp>{2}</xmp></p>',
t.action, t.method, Ext.encode(result)));
}else{
out.append(String.format('<p><b>Call to {0}.{1} failed with message:</b><xmp>{2}</xmp></p>',
t.action, t.method, e.message));
}
out.el.scroll('b', 100000, true);
});
上面的代碼排版有點亂,這里先做些說明,這個demo的下載網址,我最后會附送。可以直接查看代碼。
可以看到,對于函數的結構。如果需要傳入參數,則把參數寫在函數前面。
因為JavaScript調用服務器端方法是異步的,所以,最好的方法就是定義一個回調函數處理數據,而不是讓程序終止。
所以,對于上面的兩個方法,最后都定義了一個回調函數。這個函數的作用是用來處理服務器端返回的數據。
參數result是服務器端方法返回的數據,e是一個even對象,包括一個事務對象,這個對象包含action和method的名稱和其他一些信息。
e.status表示服務器端成功執行了函數。如果返回false,則表示服務器端出現了錯誤。通過e.message就可以查看出錯信息。
其他參數說明:
INFO : com.softwarementors.extjs.djn.servlet.DirectJNgineServlet - "Servlet GLOBAL configuration: registryConfiguratorClass=" ()
INFO : com.softwarementors.extjs.djn.servlet.DirectJNgineServlet - "Servlet APIs configuration: apis=mynamespace" ()
INFO : com.softwarementors.extjs.djn.servlet.DirectJNgineServlet - "Servlet 'mynamespace' Api configuration: apiNamespace=Ext.zhouyang, actionsNamespace=, apiFile=MyAction/MyActionApi.js => Full api file: C:\Program Files\Apache Software Foundation\Tomcat 6.0\webapps\directdemo\MyAction\MyActionApi.js, classes=com.softwarementors.extjs.djn.MyAction.MyAction" ()
INFO : com.softwarementors.extjs.djn.jscodegen.CodeFileGenerator - "Creating source files for APIs..." ()
如果非調試狀態,則可以置為false。
完成上面的步驟后,啟動tomcat,發現在\Tomcat 6.0\webapps\directdemo\MyAction 目錄下生成了三個文件。
如下:
MyActionApi.js,MyActionApi-debug.js,MyActionApi-min.js。其中的MyActionApi.js就是我們在第二步中引入的JavaScript。
它的作用相當于Server端代碼的API一樣,因為有它的存在,客戶端的網頁才知道服務器端都定義了些什么方法。我的demo中,生成的MyActionApi.js的代碼如下:
*
* Code generated automatically by DirectJNgine
* Copyright (c) 2009, Pedro Agulló Soliveres
*
* DO NOT MODIFY MANUALLY!!
*
**********************************************************************/
Ext.namespace( 'Ext.zhouyang');
Ext.zhouyang.PROVIDER_BASE_URL=window.location.protocol + '//' + window.location.host + '/' + (window.location.pathname.split('/').length>2 ? window.location.pathname.split('/')[1]+ '/' : '') + 'djn/directprovider';
Ext.zhouyang.POLLING_URLS = {
}
Ext.zhouyang.REMOTING_API = {
url: Ext.zhouyang.PROVIDER_BASE_URL,
type: 'remoting',
actions: {
MyAction: [
{
name: 'doEcho'/*(String) => String */,
len: 1,
formHandler: false
},
{
name: 'doShow'/*() => String */,
len: 0,
formHandler: false
}
]
}
}
至此,directjngine、Ext Direct調用Java服務器端方法大功告成。