使用JSON-RPC-Java完成Ajax交互

最新推荐文章于 2022-04-21 08:40:00 发布

@凌霄@

最新推荐文章于 2022-04-21 08:40:00 发布

阅读量2.2k

点赞数

分类专栏： Ajax 文章标签： ajax javascript jsp border session ajax框架

Ajax 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

JSON-RPC-Java是一个用Java来实现动态JSON-RPC的框架. 利用它内置的一个轻级量JSON-RPC JavaScripIt客户端,可以让你透明地在JavaScript中调用Java代码。JSON-RPC-Java可运行在Servlet容器中如Tomcat也可以运行在JBoss与其它J2EE应用服务器中因此可以在一个基于JavaScript与DHTML的Web应用程序中利用它来直接调用普通Java方法与EJB方法。JSON：JavaScript Object Notation

JSON-RPC-Java是一个开源Ajax框架，能够让javascript直接调用后台的Java程序。

下载地址：http://oss.metaparadigm.com/jsonrpc

注意：构筑工程需要用到jsonrpc-1.0.jar，以及开源包webapps/jsonrpc下jsonrpc.js文件。

下面是来自《基于J2EE的Ajax宝典》一书的示例代码，和大家分享一下。

web.xml文件：

<?xml version="1.0" encoding="GBK"?>
<!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
    "http://java.sun.com/dtd/web-app_2_3.dtd">
<web-app>

    <servlet>
        <servlet-name>jsonServlet</servlet-name>
        <servlet-class>com.metaparadigm.jsonrpc.JSONRPCServlet</servlet-class>
    </servlet>

    <servlet-mapping>
        <servlet-name>jsonServlet</servlet-name>
        <url-pattern>/myjson</url-pattern>
    </servlet-mapping>

</web-app>

java后台的service文件：

package lee;

import java.io.Serializable;

public class TipService implements Serializable
...{
    private static final long serialVersionUID = 1023926111323841333L;

    private String[][] tips=
    ...{
        ...{"1" , "IBM笔记本电脑，价格有点贵，<br>外观保守，适合稳重型用户。"},
        ...{"2" , "Dell笔记本电脑，价格适中，<br>兼顾中、低端用户，有更多的<br>选择余地。"},
        ...{"3" , "SONY笔记本电脑，源自日本，<br>细致工艺，优美的外观都是其<br>卖点，比较贵。"}
    };

    public String getTip(int id)
    ...{
        for (String[] tip : tips )
        ...{
            if (tip[0].equals(String.valueOf(id)))
            ...{
                return tip[1];
            }
        }
        return null;
    }
}

前台jsp文件，要使用JSONRPCBridge，直接在jsp中追加<jsp:useBean id="JSONRPCBridge" scope="session" class="com.metaparadigm.jsonrpc.JSONRPCBridge" />即可。代码如下：

<%...@ page contentType="text/html;charset=GBK"%>
<jsp:useBean id="JSONRPCBridge" scope="session" class="com.metaparadigm.jsonrpc.JSONRPCBridge" />
<jsp:useBean id="tip" scope="session" class="lee.TipService" />
<%... JSONRPCBridge.registerObject("tip", tip); %>
<HTML>
<HEAD>
<TITLE>在线商场</TITLE>
<META http-equiv=Content-Type content="text/html; charset=GBK">
</HEAD>
    <script type="text/javascript" src="jsonrpc.js"></script>
<script type="text/javascript" src="tip.js"></script>
<BODY topMargin=20 onLoad="onLoad()">
<h3 align="center">请挑选您想购买的笔记本</h3>

<table width="640" height="208" border="1" align="center" style="border-collapse:collapse">
  <tr>
    <td width="230"><img id="1" src="img/ibm.jpg" onMouseOver="getTip(this.id , event);" onMouseOut="hideTip()"/></td>
    <td width="400">
    <table width="400" border="0" style="font-size:10pt">
       <tr>
        <td><h3 align="center">ThinkPad T60 2007GT1</h3></td>
      </tr>
      <tr>
        <td><strong>处理器: </strong>Intel Core2 Duo(Merom) T7200(2.0G)</td>
      </tr>
      <tr>
        <td><strong>内存容量: </strong>512M</td>
      </tr>
      <tr>
        <td><strong>硬盘容量: </strong>120G</td>
      </tr>
      <tr>
        <td><strong>屏幕尺寸: </strong>14.1寸</td>
      </tr>
      <tr>
        <td><strong>显示芯片: </strong>独立,ATI Mobility Radeon X1300</td>
      </tr>
      <tr>
        <td><strong>重量: </strong>约2.32Kg</td>
      </tr>
    </table></td>
  </tr>
  <tr>
    <td><img id="2" src="img/dell.jpg"  onMouseOver="getTip(this.id , event);" onMouseOut="hideTip()"/></td>
    <td>
    <table width="400" border="0" style="font-size:10pt">
      <tr>
        <td><h3 align="center">戴尔 Inspiron 6400(N511212)</h3></td>
      </tr>
      <tr>
        <td><strong>处理器: </strong>Intel Core2 Duo(Merom) T5500(1.66G)</td>
      </tr>
      <tr>
        <td><strong>内存容量: </strong>512M</td>
      </tr>
      <tr>
        <td><strong>硬盘容量: </strong>120G</td>
      </tr>
      <tr>
        <td><strong>屏幕尺寸: </strong>14.1寸</td>
      </tr>
      <tr>
        <td><strong>显示芯片: </strong>独立,ATI Mobility Radeon X1300</td>
      </tr>
      <tr>
        <td><strong>重量: </strong>约2.32Kg</td>
      </tr>
    </table></td>
  </tr>
    <tr>
    <td><img id="3" src="img/sony.jpg"  onMouseOver="getTip(this.id , event);" onMouseOut="hideTip()"/></td>
    <td>
    <table width="400" border="0" style="font-size:10pt">
      <tr>
        <td><h3 align="center">索尼 VGN-AR18CP</h3></td>
      </tr>
      <tr>
        <td><strong>处理器: </strong>Intel Core Duo(Yonah) T2600(2.16G)</td>
      </tr>
      <tr>
        <td><strong>内存容量: </strong>2048M</td>
      </tr>
      <tr>
        <td><strong>硬盘容量: </strong>160G</td>
      </tr>
      <tr>
        <td><strong>屏幕尺寸: </strong>17寸</td>
      </tr>
      <tr>
        <td><strong>显示芯片: </strong>独立,nVidia Geforce Go7600GT</td>
      </tr>
      <tr>
        <td><strong>重量: </strong>约3.8Kg</td>
      </tr>
    </table>
    </td>
  </tr>
</table>
<div id="tip" style="position:absolute; z-index:100;font-size:10pt;background-color:#eeeeaa;border:1px solid #999999" >
</div>
</BODY>
</HTML>

这里提一下,在servlet中使用JSONRPCBridge，代码如下：

HttpSession session = request.getSession();
JSONRPCBridge jsonBridge = null;
jsonBridge = (JSONRPCBridge)session.getAttribute("JSONRPCBridge");
if(jsonBridge == null)...{
jsonBridge = new JSONRPCBridge();
session.setAttribute("JSONRPCBridge", jsonBridge);
}

由jsp页面可知，在jsp中暴露处理类的方法为：

<jsp:useBean id="tip" scope="session" class="lee.TipService" />
<%... JSONRPCBridge.registerObject("tip", tip); %>

jsonrpc.js文件在JSON-RPC开源包中可以取到。tip.js文件如下：

var jsonrpc;
var tipDiv;
var top;
var left;

function onLoad()
...{
    jsonrpc = new JSONRpcClient("myjson");
}

function getTip(id , event)
...{
    if (navigator.appName == "Microsoft Internet Explorer")
    ...{
        left = event.x;
        top = event.y;
    }
    else
    ...{
        left = event.pageX;
        top = event.pageY;
    }
    tipDiv = document.getElementById("tip");
    jsonrpc.tip.getTip(cb, id);
    tipDiv.style.left = left;
    tipDiv.style.top = top;
    tipDiv.style.display = "";
}

function cb(result, exception)
...{
    if(result == null && exception != null)
    ...{
        alert(exception.message);
    }
    if (result != null && exception == null)
    ...{
        tipDiv.innerHTML=result;
    }
}

function hideTip()
...{
    tipDiv.style.display = "none";
}