Ajax-使用JSON向服务器发送数据.doc_第1页
Ajax-使用JSON向服务器发送数据.doc_第2页
Ajax-使用JSON向服务器发送数据.doc_第3页
Ajax-使用JSON向服务器发送数据.doc_第4页
Ajax-使用JSON向服务器发送数据.doc_第5页
已阅读5页,还剩5页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

Ajax - 使用JSON向服务器发送数据使用JSON向服务器发送数据 做了这么多,你已经能更顺手地使用JavaScript了,也许在考虑把更多的模型信息放在浏览器上。不过,看过前面的例子后(使用XML向服务器发送复杂的数据结构),你可能会改变主意。通过串连接来创建XML串并不好,这也不是用来生成或修改XML数据结构的健壮技术。JSON概述XML的一个替代方法是JSON,可以在找到。JSON是一种文本格式,它独立于具体语言,但是使用了与C系列语言(如C、C#、JavaScript等)类似的约定。JSON建立在以下两种数据结构基础上,当前几乎所有编程语言都支持这两种数据结构:l 名/值对集合。在当前编程语言中,这实现为一个对象、记录或字典。l 值的有序表,这通常实现为一个数组。因为这些结构得到了如此众多编程语言的支持,所以JSON是一个理想的选择,可以作为异构系统之间的一种数据互换格式。另外,由于JSON是基于标准JavaScript的子集,所以在所有当前Web浏览器上都应该是兼容的。JSON对象是名/值对的无序集合。对象以 开始,以 结束,名/值对用冒号分隔。JSON数组是一个有序的值集合,以 开始,以 结束,数组中的值用逗号分隔。值可以是串(用双引号引起)、数值、true或false、对象,或者是数组,因此结构可以嵌套。图3-6以图形方式很好地描述了JSON对象的标记。图3-6JSON对象结构的图形化表示(摘自)请考虑employee对象的简单例子。employee对象可能包含名、姓、员工号和职位等数据。使用JSON,可以如下表示employee对象实例:var employee = firstName : John , lastName : Doe , employeeNumber : 123 , title : Accountant然后可以使用标准点记法使用对象的属性,如下所示:var lastName = employee.lastName; /Access the last namevar title = employee.title; /Access the titleemployee.employeeNumber = 456; /Change the employee numberJSON有一点很引以为豪,这就是它是一个轻量级的数据互换格式。如果用XML来描述同样的employee对象,可能如下所示: John Doe 123 Accountant显然,JSON编码比XML编码简短。JSON编码比较小,所以如果在网络上发送大量数据,可能会带来显著的性能差异。网站列出了至少与其他编程语言的14种绑定,这说明,不论在服务器端使用何种技术,都能通过JSON与浏览器通信。使用JSON的示例(此例子需要json.js,/js.html 最下面的链接点击下载,此例子使用的是比较老版本的json.js,如果你下载的是新的,使用的方法就不同了;JSONObject.java,JSONArray.java,/java/index.html下载,注意不是java JSON-lib虽然里面也有这两个类,可能是版本原因不同了如果你要用json-lib,那你就必须下载json-lib-2.0-jdk15.jar,还必需下面5个jarjakarta commons-lang, jakarta commons-beanutils, jakarta commons-collections jakarta commons-logging ,ezmorph 缺少任何一个都是不行的,试过了 !前面4个在下载,最后一个在/下载下面红色字体都是分歧部分,就看你是用什么了,经本人测试没问题。)下面是一个简单的例子,展示了如何使用JSON将JavaScript对象转换为串格式,并使用Ajax技术将这个串发送到服务器,然后服务器根据这个串创建一个对象。这个例子中没有业务逻辑,也几乎没有用户交互,它强调的是客户端和服务器端的JSON技术。图3-7显示了一个“字符串化的”Car对象。图3-7“字符串化的”Car对象因为这个例子几乎与前面的POST例子完全相同,所以我们只关注JSON特定的技术。点击表单上的按钮将调用doJSON函数。这个函数首先调用getCarObject函数来返回一个新的Car对象实例,然后使用JSON JavaScript库(可以从免费得到)将Car对象转换为JSON串,再在警告框中显示这个串。接下来使用XMLHttpRequest对象将JSON编码的Car对象发送到服务器。因为有可以免费得到的JSON-Java绑定库,所以编写Java servlet来为JSON请求提供服务相当简单。更妙的是,由于对每种服务器端技术都有相应的JSON绑定,所以可以使用任何服务器端技术实现这个例子。JSONExample servlet的doPost方法为JSON请求提供服务。它首先调用readJSONStr- ingFromRequestBody方法从请求体获得JSON串,然后创建JSONObject的一个实例,向JSONObject构造函数提供JSON串。JSONObject在对象创建时自动解析JSON串。一旦创建了JSONObject,就可以使用各个get方法来获得你感兴趣的对象属性。这里使用getString和getInt方法来获取year、make、model和color属性。这些属性连接起来构成一个串返回给浏览器,并在页面上显示。图3-8显示了读取JSON对象之后的服务器响应。代码清单3-11显示了jsonExample.html,代码清单3-12显示了JSONExample.java。代码清单3-11jsonExample.htmlJSON Examplevar xmlHttp;function createXMLHttpRequest() if (window.ActiveXObject) xmlHttp = new ActiveXObject(Microsoft.XMLHTTP); else if (window.XMLHttpRequest) xmlHttp = new XMLHttpRequest(); function doJSON() var car = getCarObject(); /Use the JSON JavaScript library to stringify the Car object /var carAsJSON = JSON.stringify(car); 老版本的json.js的用法 var carAsJSON = car.toJSONString(); alert(Car object as JSON:n + carAsJSON); var url = JSONExample?timeStamp= + new Date().getTime(); createXMLHttpRequest(); xmlHttp.open(POST, url, true); xmlHttp.onreadystatechange = handleStateChange; xmlHttp.setRequestHeader(Content-Type, application/x-www-form-urlencoded;); xmlHttp.send(carAsJSON);function handleStateChange() if(xmlHttp.readyState = 4) if(xmlHttp.status = 200) parseResults(); function parseResults() var responseDiv = document.getElementById(serverResponse); if(responseDiv.hasChildNodes() responseDiv.removeChild(responseDiv.childNodes0); var responseText = document.createTextNode(xmlHttp.responseText); responseDiv.appendChild(responseText);function getCarObject() return new Car(Dodge, Coronet R/T, 1968, yellow);function Car(make, model, year, color) this.make = make; this.model = model; this.year = year; this.color = color; Server Response: 代码清单3-12JSONExample.javapackage ajaxbook.chap3;import java.io.*;import .*;import java.text.ParseException;import javax.servlet.*;import javax.servlet.http.*;import org.json.JSONObject;/import net.sf.json.*;public class JSONExample extends HttpServlet protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException String json = readJSONStringFromRequestBody(request); /Use the JSON-Java binding library to create a JSON object in Java JSONObject jsonObject = null; try /如果是用json-lib的话,前面引进的包改为 /import net.sf.json.*; /这里改为 /jsonObject = JSONObject.fromObject(json); /fromObject(object)是static的。也可以用fromString(string)的,但官方是不建议用fromString的。 jsonObject = new JSONObject(json); catch(ParseException pe) System.out.println(ParseException: + pe.toString(); String responseText = You have a + jsonObject.getInt(year) + + jsonObject.getString(make) + + jsonObject.getString(model) + + that is + jsonObject.getString(color) + in color.; response.setContentType(text/xml); response.getWriter().print(responseText); private String readJSONStringFromRequestBody(HttpServletRequest request) StringBuffer json = new StringBuffer(); String line = null; try BufferedReader reader = request.getReader(); while(line =

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论