`

Ajax 使用JSON向服务器发送数据

    博客分类：
  • AJAX
jsonAjaxJavaScriptServletHTML 
阅读更多

文件一览

  • JSONExample.java
  • jsonExample.html

JSONExample.java

package ajaxbook.chap3;

import java.io.BufferedReader;
import java.io.IOException;

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

import org.json.JSONException;
import org.json.JSONObject;

public class JSONExample extends HttpServlet {

	@Override
	protected void doPost(HttpServletRequest req, HttpServletResponse resp)
			throws ServletException, IOException {
		String json = readJSONStringFromRequestBody(req);
		JSONObject jsonObject = null;
		try {
			jsonObject = new JSONObject(json);
			String responseText = "You have a " + jsonObject.getInt("year") + " "
			+ jsonObject.getString("make") + " " + jsonObject.getString("model")+ " "
			+ "that is " + jsonObject.getString("color") + " in color";
			resp.setContentType("text/xml");
			resp.getWriter().print(responseText);
		} catch(JSONException pe) {
			System.out.println("JSONException: " + pe.toString());
		}

	}
	
	private String readJSONStringFromRequestBody(HttpServletRequest request) {
		StringBuffer json = new StringBuffer();
		String line = null;
		try {
			BufferedReader reader = request.getReader();
			while ((line = reader.readLine()) != null) {
				json.append(line);
			}
		} catch (Exception e) {
			System.out.println("Error reading JSON string: " + e.toString());
		}
		return json.toString();
	}
}

 

 

jsonExample.html

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<script language="JavaScript" src="./js/json2.js" type="text/javascript"></script>
<script type="text/javascript">
var xmlHttp;
function createXMLHttpRequest() {
	if (window.ActiveXObject) {
		xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
	} else if (window.XMLHttpRequest) {
		xmlHttp = new XMLHttpRequest();
	}
}
function doJSON() {
	var car = getCarObject();
	
	var carAsJSON = JSON.stringify(car); 
	alert("Car Object as JSON:\n "+carAsJSON);
	
	createXMLHttpRequest();
	
	var url = "JSONExample?timeStamp="+new Date().getTime();
	xmlHttp.open("POST",url,true);
	xmlHttp.onreadystatechange=handleStateChange;
	xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;");
	xmlHttp.send(carAsJSON);
}
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;
}
function handleStateChange() {
	if (xmlHttp.readystate == 4) {
		if (xmlHttp.status == 200) {
			parseResults();
		}
	}
}
function parseResults() {
	var responseDiv = document.getElementById("serverResponse");
	if (responseDiv.hasChildNodes()) {
		responseDiv.removeChild(responseDiv.childNodes[0]);
	}
	var responseText = document.createTextNode(xmlHttp.responseText);
	responseDiv.appendChild(responseText);
}

</script>
<head>
</head>
<body>
	<h1>Select the types of pets in your home:</h1>
	<br />
	<br />
	<form action="#">
		<input type="button" value="Click here to send JSON data to the server" onclick="doJSON()" />
	</form>
	<h2>Server Response:</h2>
	<div id="serverResponse"></div>
</body>
</html>

 其中java里要导入org.json.jar包，JavaScript要引入json2.js文件，这两个文件都在下面的附件里。

 

0
顶
1
踩
分享到：
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    Ajax使用JSON向服务器发送数据.doc

    Ajax使用JSON向服务器发送数据.doc

    7、使用JSON向服务器发送数据——ajax基础笔记

    NULL 博文链接：https://jiangzhengjun.iteye.com/blog/493605

    ajax+json实例

    在.NET中使用AJAX技术来做服务器端和客户端交互，用JSON做为在异步应用程序中发送和接收信息的数据格式。

    文件上传和ajax获取json的小示例

    jsp上传图片的示例，把文件保存在服务器和数据库，数据从数据库的获取，可以通过ajax来发送请求来获取，实现自动刷新的功能，实时获取数据库的数据，用json的方式返回给页面

    Ajax与JSON的一些学习总结

    XMLHttpRequest对象用于在后台与服务器交换数据，具体作用如下： 在不重新加载页面的情况下更新网页 在页面已加载后从服务器请求数据 在页面已加载后从服务器接收数据 在后台向服务器发送数据 1.1.2 正文 ...

    jquery的ajax异步请求接收返回json数据实例

    jquery的ajax异步请求接收返回json数据方法设置简单，一个是服务器处理程序是返回json数据，另一种就是ajax发送设置的datatype设置为jsonp格式数据或json格式都可以。 代码示例如下： 代码如下: $(‘#send’).click...

    Ajax + Servlet 跨域访问(Jsonp技术)

    使用jsonp跨域获取json数据。Ajax获取JAVA服务器json数据。

    javascript解析ajax返回的xml和json格式数据实例详解

    本文实例讲述了javascript解析ajax返回的xml和json格式数据。分享给大家供大家参考，具体如下： 写个例子，以备后用 一、JavaScript 解析返回的xml格式的数据： 1、javascript版本的ajax发送请求 （1）、创建...

    AJAX和jQuery动态加载数据的实现方法

    什么是AJAX？ 这里的AJAX不是希腊神话里的英雄，也不是清洁剂品牌，更不是一门语言...在不重载页面的情况下，向服务器发送请求； 动态加载数据，即在后台交换数据。 比方说，一个便签本应用，当你在表单里填写好内容，

    Ajax基础教程（扫描版）

    3.2.2 使用json向服务器发送数据 64 3.3 小结 70 第4章 实现基本ajax技术 71 4.1 完成验证 71 4.2 读取响应首部 75 4.3 动态加载列表框 79 4.4 创建自动刷新页面 85 4.5 显示进度条 90 4.6 创建工具提示 95 ...

    关于前后端json数据的发送与接收详解

    最近因为笔者后台使用的是flask框架接收和前端使用的是原生的JavaScript和jQuery的ajax发送，能力有限，在此仅写下我开发项目过程中所得，分享出来供大家参考学习，下面话不多说，跟着小编来一起看看详细的介绍： ...

    springmvc接收ajax请求注意事项

    如果 Ajax 请求需要将一个表单中的数据传输到后台，那么需要使用 jQuery Form 插件，并将表单数据序列化后传输到服务器。例如： ```javascript function btnform() { $.ajax({ url: "${pageContext.request....

    ajax经典怎样传输数据

    ajax经典怎样传输数据，$.ajax({ async: true, // 默认true(异步请求) cache: true, // 默认true,设置为 false 将不会从浏览器缓存中加载请求信息。 type: "POST", // 默认:GET 请求方式:[POST/GET] dataType: ...

    jquery 获取json数据实现代码

    代码如下://栏目 //发送ajax请求 $.getJSON( “../../../Templet/GetInfoHandler.ashx”, //产生JSON数据的服务端页面 {id: “0”, sid: “1;2;3”, rid: Math.round(Math.random() * 10) }, //向服务器发出的查询...

    使用$.getJSON实现跨域ajax请求示例代码

    url: 发送请求的地址 data : (可选) 待发送key/value参数 callback: (可选) 载入成功时的回调函数 主要用于客户端获取服务器JSON数据。简单示例： 服务器脚本，返回JSON数据： 代码如下: // $.getJSON.php $arr=...

    JQuery中使用ajax传输超大数据的解决方法

    后来，客户的数据超过2000的时候，还是一样，php端还是不能完全接受到ajax发送过来的数据。最后，在国外的一网站上，找到了解决方案。 在post发送前，将要发送的变量用JSON.stringify处理下，就ok了.JSON.stringify...

    mybic_1_0_0.zip_BIC_My-BIC_mybic_json p_php xml_submission

    JSON客户端Encoding支持：利用该功能你就能够在客户端或服务器之间发送和接收经过JSON Encoding的数据。 网络断线保护：当服务器Down掉时My-BIC将帮助你删除请求并阻止产生更多的调用。 内置Submission队列：所有...

    ashx文件获取$.ajax()方法发送的数据

    今天在使用Jquery的ajax方法发送请求时，发现在后台中使用ashx文件无法接收到ajax方法中传递的参数，上网查了一下原因后发现了问题所在，原来是我在$.ajax方法中指明了”contentType: ‘application/json;...

Magicbox
Global site tag (gtag.js) - Google Analytics