AJAX远程调用之JSON篇原创

最新推荐文章于 2024-05-22 10:03:23 发布

邦WLB

最新推荐文章于 2024-05-22 10:03:23 发布

阅读量3.1k

点赞数

文章标签： json ajax delphi vector javascript function

本文链接：https://blog.csdn.net/liboy/article/details/1966178

版权

欢迎进入我的blog http://86804.qzone.qq.com

使用ajax的目的是实现不刷新网页，读取和显示远程数据的功能。除了该功能外，还可以用作不同语言编写的信息系统、网站之间互相交换数据的方式。

在制作信息系统的时候，我需要实现以下功能：
1、后台制作接口
2、网站程序可以调用该接口获取数据
3、用delphi编写的应用程序也可以调用该接口获取数据

以前一直使用xml-rpc来实现上述功能，总体来说，用了近2年，也还可以，但仍有以下不足之处：

1、使用xml格式，传输内容比较庞大，特别是在传送的内容比较多的时候。
2、delphi对xmlrpc的调用有内存漏露现象（第三方开源控件写得不好，但是也没有其他选择）
3、java的xmlrpc包，对中文的支持不好，需要先将中文解码保存，客户端取的时候再解码。

由于一些需求的变更，我转为研究用json的实现，并且在网页的javascript中调用后台jsp中的输出成功。

关于json的介绍，大家可以进入官方网站查看 JSON

首先下载：
1、http://www.json.org/java/json.zip  json的解释包，将其解压后放到resin或者tomcat的classes目录下
2、prototype.js  http://www.prototypejs.org/ javascript框架，网上有关于该框架的介绍，通过他来实现ajax调用
3、http://www.json.org/js.html 下载 http://www.json.org/json.js

相关源代码：
hello.jsp
-----------------------------------------------------------------------
<%@ page c%>
<html>
  <head>
<meta http-equiv="Content-Type" c />
    <script type="text/javascript" src="prototype.js"></script>
     <script type="text/javascript" src="json.js"></script>
    <script type="text/javascript" src="hello.js"></script>
    <title>JSON Java Hello</title>
   </head>
   <body bgcolor="#ffffff">
    <p>
      <strong>Who:</strong>
      <input type="text" id="who" size="30" value="中华人民共和国" />

      <input type="button" value="Say Hello"  />
    </p>
  </body>
</html>

hello.js
-----------------------------------------------------------------------------
function onLoad()
{
}
function clickHello()
{
//将一个json对象传到后台
jobj = new Object();
jobj.name = '张三';
jobj.age = 22;
jobj.high = 33.33;
jobj.about = '他    是   个  &t=猪   头[\'"]';
var who = $F('who');
who = encodeURIComponent( who ); //为了避免特殊HTML符号
var json = jobj.toJSONString();
json = encodeURIComponent( json ); //为了避免特殊HTML符号

var url = 'http://localhost/query.jsp';
var pars = 'who=' + who + '&json=' + json;
alert( pars );
var myAjax = new Ajax.Request(
  url,
  {
  method: 'post',
  parameters: pars,
  onComplete: showResponse
  }
);
}
function showResponse(originalRequest)
{
var obj = originalRequest.responseText.evalJSON(true);

alert( '开始' );
alert( obj.row1.name + ',' + obj.row1.age + ',' + obj.row1.high + ',' + obj.row1.about );
alert( obj.row2.name + ',' + obj.row2.age + ',' + obj.row2.high + ',' + obj.row2.about );
for( var i=0; i<3; i++ ) //obj.vector.length
  alert( obj.vector[i] );
alert( obj.vector[3].name + ',' + obj.vector[3].about );
alert( '结束.' );
}

query.jsp
---------------------------------------------------------------------
<%
response.setHeader("Pragma","No-cache");
response.setHeader("Cache-Control","no-cache");
response.setDateHeader("Expires", 0);
%>
<%@ page c%>
<%@ page import="org.json.*"%>
<%@ page import="java.util.*"%>
<%

//===============================================================================
// 输入
//===============================================================================
request.setCharacterEncoding("UTF-8"); //不设置会中文乱码

String who = request.getParameter( "who" );
String json = request.getParameter( "json" );
System.out.println( "who=" + who );
System.out.println( "json=" + json );
if( json != null ) {
try {
  JSONObject jsonObj = new JSONObject(json);
  System.out.println(jsonObj.getString("name"));
  System.out.println(jsonObj.getInt("age"));
  System.out.println(jsonObj.getDouble("high"));
  System.out.println(jsonObj.getString("about"));
} catch (JSONException e) {
  e.printStackTrace();
}
}

//===============================================================================
// 输出
//===============================================================================
//队列
JSONObject jr = new JSONObject();

//创建行1
JSONObject jobj = new JSONObject();
jobj.put( "name", "张三峰" );
jobj.put( "age", 17 );
jobj.put( "high", 173.58 );
jobj.put( "about", "这是一个没人性的家伙,['\"]" );
jr.put( "row1", jobj );
//创建行2
jobj = new JSONObject();
jobj.put( "name", "李小龙" );
jobj.put( "age", 27 );
jobj.put( "high", 273.58 );
jobj.put( "about", "爱出风头" );
jr.put( "row2", jobj );

//队列测试
Vector v = new Vector();
v.add( "值1" );
v.add( "值2" );
v.add( "值3" );
jobj = new JSONObject();
jobj.put( "name", "马头五" );
jobj.put( "age", 37 );
jobj.put( "high", 2222.58 );
jobj.put( "about", "马'\"'\"头" );
v.add( jobj );
jr.put( "vector", v );

//输出，可直接在IE中查看输出
String str = jr.toString();
out.println( str );
%>

将上述文件和 prototype.js 同时放到 web 目录下，运行 hello.jsp，点击按钮，即可看到输出。

总结：
1、json的中文的支持比较好，但是不支持键名使用中文。
2、比xml来说，内容大大减少
3、对jsp编程来说，不需要特殊的第三方包，也不需要json-rpc-java等比较占资源的应用包。
4、由于json支持的语言很多，值得推荐大家使用。
5、使用的时候注意有时候jsp会缓存输出，所以要禁止缓存发生。