日期:2014-05-16  浏览次数:20552 次

使用ExtDirectSpring整合Spring3和ExtJs4

ExtDirectSpring是一个用于ExtJs4直接调用远程Spring方法的第三方库。我们不再需要在spring方法中封装json对象供外界调用,ExtJs4也不再需要手动解析远程服务器返回过来的Json对象,所有这些操作都由ExtDirectSpring去处理,ExtJs4只需要象调用本地方法一样去操作远程资源。

?

ExtDirectSpring主页地址:

https://github.com/ralscha/extdirectspring

?

以下是一个简要的工程搭建过程(我们假设你已经创建了一个Spring MVC的工程)

1: 在pom.xml中添加相关依赖

?

    <dependency>
        <groupId>ch.ralscha</groupId>
        <artifactId>extdirectspring</artifactId>
        <version>1.2.0</version>
    </dependency>
    <dependency>
        <groupId>commons-fileupload</groupId>
        <artifactId>commons-fileupload</artifactId>
        <version>1.2.2</version>
    </dependency>
    <dependency>
        <groupId>commons-io</groupId>
        <artifactId>commons-io</artifactId>
        <version>2.1</version>
    </dependency>

?

2: 将含有@ExtDirectMethod标签的类所在包添加到Spring组件管理中

注:所有被暴露出来允许远程访问的方法都需要添加@ExtDirectMethod注解

?

<context:component-scan base-package="com.train.extdirectspring,ch.ralscha.extdirectspring" />

?

3: 在Spring配置文件中添加对ExtDirectSpring的全局配置信息

?

    <bean id="extDirectSpringConfiguration" class="ch.ralscha.extdirectspring.controller.Configuration" p:timeout="12000"
        p:maxRetries="10" p:enableBuffer="false">
        <property name="exceptionToMessage">
            <map>
                <entry key="java.lang.IllegalArgumentException" value="illegal argument" />
                <entry key="org.springframework.beans.factory.NoSuchBeanDefinitionException">
                    <null />
                </entry>
            </map>
        </property>
    </bean>
?

到此为止,服务器端的配置基本完成,下面开始讲述页面前端如何配置调用远程后端方法。

?

?

4: 下载并复制ExtJs4的关联文件到工程中去

  • 从官网下载并解压http://www.sencha.com/products/extjs
? ??
?
  • 复制文件夹locale, resources及文件ext-all-debug.js and ext-all.js到WEB工程目录中? ??
? ??
?
5: 引入ExtJs4的CSS和JS文件到你的页面中
<link rel="stylesheet" type="text/css" href="/resources/extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="/resources/extjs/ext-all-debug.js" ></script>
?
6: 引入ExtDirectSpring提供的api.js/api-debug.js文件到你的页面中
<script type="text/javascript" src="/spring/api-debug.js"></script>
?注:这里的/spring/前缀取决于你的web.xml中的Spring?Dispatcher的配置。并且该api-debug.js是由系统生成而非一个静态文件。

7: 引入用于当前页面布局的js文件
<script type="text/javascript" src="/SpringMVC/resources/app/welcome.js"></script>
? 注:该文件由用户自定义

?从下面开始我们就要开始编写Extjs代码,我们采用Extjs的MVC框架,编写的一般过程为:编写页面布局js(上面的welcome.js) ->