傅老师课堂:Ajax高级应用之DWR原理解析(一)

开篇一笑:一男女朋友正卿卿我我,男想进一步。男:“你是处女吗?”女:“嗯,你是处男吗?”男:“当然了!”女:“这是第一次,我怕疼,还是不要了吧。”男:“我会很小心的,不会疼。”女:“你们每个男人每次都这样说,结果我每次都很疼…”男:“那是因为他们都是新手~”

注:此篇文章适合于有一定DWR基础的开发人员
上课啦,上课啦,后面那位男同学别睡觉啦,哈喇子都流出来了,女同学都往前面坐,让老师看的更清楚点,哦,不对,是让你们看的更清楚点,因为这节课的内容非常重要。老师从娘胎里出来的时候就一直强调万变不离其中,只要掌握了原理,那么一切的一切就尽在你的掌握中,这位漂亮的女同学,你说是与不是呢?!
好了,言归正传,大家在学习DWR的过程中,肯定都会有两个疑问:自定义的js文件到底哪来的?javascript中怎么能够调用Java方法呢?
别着急,老师今天来讲课就是为了给大家解答这两个问题的。这位女同学不要这么崇拜的看着老师。
我们都知道要在前台页面中使用DWR,至少需要引入三个js文件:
<script type='text/javascript' src='../dwr/engine.js'></script>
<script type='text/javascript' src='../dwr/util.js'></script>
<script type='text/javascript' src='../dwr/interface/demo.js'></script>
前面两个都是DWR自带的js文件,保存在dwr.jar中,其中engine.js是引擎文件必须加载,util.js是工具文件可以选择加载。demo.js“文件”实际上并不能称得上是一个真正的物理文件,因为它根本不存在,它只是在配置文件dwr.xml中进行了配置且与某个Java类关联。那么这个js文件在页面加载的时候是怎么来的?而我们又是怎么能够使用它里面的方法呢?
先看看DWR在web.xml中的配置:
<servlet>
     <servlet-name>dwr-invoker</servlet-name>
     <servlet-class>
         org.directwebremoting.servlet.DwrServlet
     </servlet-class>
</servlet>
<servlet-mapping>
     <servlet-name>dwr-invoker</servlet-name>
     <url-pattern>/dwr/*</url-pattern>
</servlet-mapping>
只要是路径为/dwr/*的请求,必然都会经过DwrServlet类,那么我们可以推测demo.js是DwrServlet给的,怎么给?只能是通过文件流的方式往前台输出,大家也可以在地址栏里直接访问../dwr/interface/demo.js查看文件内容。
那么DwrServlet是如何输出文件流的呢?接下来我们可以做一个简单的例子测试一下。
新建Servlet类DwrServlet.java
package com.dwr;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.ServletOutputStream;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class DwrServlet extends HttpServlet {

    @Override
    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        doPost(request, response);
    }

    @Override
    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        ServletOutputStream out = null;
        try {
            out = response.getOutputStream();
            byte[] b = "function test(){alert('OK')}".getBytes();
            out.write(b);
            out.flush();
            out.close();
        } catch (IOException e) {
            e.printStackTrace();
        }
    }
}
在web.xml中配置DwrServlet
<?xml version="1.0" encoding="UTF-8"?>
<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">
  <welcome-file-list>
    <welcome-file>index.jsp</welcome-file>
  </welcome-file-list>
 
  <servlet>
      <servlet-name>dwr-invoker</servlet-name>
        <servlet-class>
            com.dwr.DwrServlet
        </servlet-class>
  </servlet>
  <servlet-mapping>
        <servlet-name>dwr-invoker</servlet-name>
        <url-pattern>/dwr/*</url-pattern>
   </servlet-mapping>
</web-app>
前台页面index.jsp
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    <title>My DWR</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <script type="text/javascript" src="dwr/interface/demo.js"></script>
  </head>
  <body>
    <input type="button" value="测试" οnclick="test()"><br>
  </body>
</html>
访问上面的index.jsp页面,点击按钮“测试”,可以看到弹出alert对话框“OK”。你和你的小伙伴是不是都惊呆了?!
第一个问题算是解决完了,这节课就到这里,下节课老师继续给同学们解答第二个问题(javascript中怎么能够调用Java方法呢?),另外,女同学要是还有疑惑,下课后老师给你们单独进行辅导,男同学就自个琢磨吧。下课。

注意:本文主要是通过最简单的方式去解释DWR的原理,所以在代码实现上跟DWR有很大的不同,请大家不要误解。

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值