WEB开发之旅—站在山脚下【续 2】

WEB开发之旅—站在山脚下【续 2】

无论是传统的web开发还是上面提到的Ajax技术,在client与server数据交换中,都是client首先发起pull动作,之后,server给以响应,而若我们期待server端的变化比如server是监控某台主机的运行情况能够实时的主动反馈到client,那我们就要考虑Reverse Ajax了,它能够使得server主动的push数据到client,接下来我们以clock时钟程序为例,演示一下Reverse Ajax技术:

A.开发server端程序Clock

 

package org.twolf.dwrdemo.clock;

 

 

public class Clock implements Runnable

{

    public Clock()

    {

        ServletContext servletContext = WebContextFactory.get().getServletContext();

        sctx = ServerContextFactory.get(servletContext);

    }

    public synchronized void toggle()

    {

        active = !active;

        if (active)

        {

            new Thread(this).start();

        }

    }

 

    /*

     * @see java.lang.Runnable#run()

     */

    public void run()

    {

        try

        {

            log.debug("CLOCK: Starting server-side thread");

 

            while (active)

            {

                Collection sessions = sctx.getScriptSessionsByPage("/dwr/clock/index.html");

                Util pages = new Util(sessions);

                pages.setValue("clockDisplay", new Date().toString());

 

                log.debug("Sent message");

                Thread.sleep(1000);

            }

 

            Collection sessions = sctx.getScriptSessionsByPage("/dwr/clock/index.html");

            Util pages = new Util(sessions);

            pages.setValue("clockDisplay", "");

 

            log.debug("CLOCK: Stopping server-side thread");

        }

        catch (InterruptedException ex)

        {

            ex.printStackTrace();

        }

    }

 

    /**

     * Our key to get hold of ServerContexts

     */

    private ServerContext sctx;

 

    /**

     * Are we updating the clocks on all the pages?

     */

    private transient boolean active = false;

    private static final Logger log = Logger.getLogger(Clock.class);

}

B.配置dwr.xml

向该配置文件中加入下面的配置信息:

   <!-- clock -->

    <create creator="new" javascript="Clock" scope="application">

      <param name="class" value="org.twolf.dwrdemo.clock.Clock"/>
   </create>

C.书写client端

如上图1所示,我们需要完成WebRoot/clock目录下index.html文件的代码书写:

index.html:

<!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">

<head>

<title>Server Side Reverse Ajax Clock</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script type='text/javascript' src='/dwr/dwr/interface/Clock.js'> </script>

<script type='text/javascript' src='/dwr/dwr/engine.js'> </script>

<script type='text/javascript' src='/dwr/dwr/util.js'> </script>

</head>

<body onload="dwr.engine.setActiveReverseAjax(true);">

<h1>Server Side Reverse Ajax Clock</h1>

<p>Creating a clock in a web page is easy, but what about a clock controlled by

the server? This demo shows how use use a separate server side thread to control

a number of browsers.</p>

<input type="button" value="Start / Stop" onclick="Clock.toggle();"/>

<p></p>

<div style="font-size:200%;" id="clockDisplay"></div>

</body>

</html>

 

 

至此,重新部署该工程,启动tomcat,便可运行本程序,如下图3所示:

 

 

 

                                                                  图 3

5、小结

A.大致开发流程

1.编写业务代码,该代码是和dwr无关的
       2.
确认业务代码中哪些类、哪些方法要由javascript直接访问的
       3.
编写dwr组件,对步骤2的方法进行封装

4.配置dwr组件到dwr.xml文件中,如果有必要,配置convert, 进行java和javascript类型互转
       5.通过反射机制,dwr将步骤4的类转换成javascript代码,提供给前台页面调用
       6.编写网页,调用步骤5的javascript中的相关方法(间接调用服务器端的相关类的方法),执行业务逻辑,将执行结果利用回调函数返回
      7.在回调函数中,得到执行结果后,可以继续编写业务逻辑的相关javascript代码
      B.为何要将用到的js单独写成一个文件,而不是混用在html页面中?
      原因有二:一是维护方便,二是与浏览器解析效率有关
      C.可能遇到的问题与解决方法【Qusetion&Answer】

#Q

log4j:WARN No appenders could be found for logger (org.directwebremoting.util.Logger).

log4j:WARN Please initialize the log4j system properly.

#A

没有加载log4j

#Q
         log4j:WARN No appenders could be found for logger (org.apache.commons.digester.Digester.sax).
         log4j:WARN Please initialize the log4j system properly.
         #A
         没有加载log4j

#Q

[org.directwebremoting.dwrp.DefaultConverterManager]-[INFO] Probably not an issue: org.jdom.Document is not available so the jdom converter will not load. This is only an problem if you wanted to use it.

#A

缺少jdom.jar

 

四、EXTJS

应用举例

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值