关于使用Ajax传输JSON格式信息至Servlet处理
首先准备一些前端页面
<form>
姓名:<input type="text" id="username"></br>
消费:<input type="text" id="pay"></br>
生日:<input type="date" id="userdate"></br>
<input type="button" onclick="tj()" value="上传">
</form>
其中x1(),x2(),x3()方法都是为了验证表单内容所准备。
接下来是使用JavaScript添加表单的验证方法
//记得导入Jquery
<script src="js/jquery-1.8.3.min.js"></script>
首先要声明一个XMLHttpRequest进行数据收发。很关键,勿忘。
var http = new XMLHttpRequest();//可以发送数据,也可以接收数据
//tj()是点击方法
function tj() {
if (x1() && x2() && x3()){
//全部成功,进行数据传输,首先获取数据并转存为json对象
var usname = document.getElementById("username");
var userpay = document.getElementById("userpay");
var userdate = document.getElementById("userdate");
//此时的json数据还不能作为json对象发送
var jsonsj = {
username:usname.value,
userpay:userpay.value,
userdate:userdate.value
};
//发送请求
//设置传输属性:传输方式、传输位置、是否异步
http.open("post","/DataServlet",true);
//开始传输:选择数据,这里选择刚刚声明的json
//JSON.stringify(jsonsj)是为了将jsonsj转换成可以传输的json数据,此处很关键。
http.send(JSON.stringify(jsonsj));
}else {
alert("未成功,有数据格式有误")
}
}
之后如果需要接收服务器传回的数据,可以添加以下方法
//当readstate属性改变时,查看XMLHttpRequest中由服务器传回的数据
http.onreadystatechange =function () {
//新建一个发送数据的特殊js对象
if (http.readyState == 4 && http.status == 200) {
//处于第四步等待状态,并且页面200状态正常,既可以开始执行
var tex = http.responseText;//获取接收到的数据
console.log(tex);
}
};
到这里,页面发送json数据的过程执行完了,之后要去sevlet中编写接收Json数据的代码。
需要json相关jar包,java-json.jar
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//声明字符集格式
request.setCharacterEncoding("UTF-8");
response.setContentType("text/html;charset=UTF-8");
//首先声明一个StringBuilder用于接收数据
StringBuilder stringBuilder = new StringBuilder();
String len = null;
//使用request.getReader()方法获取传入的JSON对象
BufferedReader reader = request.getReader();
System.out.println(reader);
while ((len=reader.readLine())!=null){
//取出传入
stringBuilder.append(len);
}
//将json转换成为字符串类型
String str = stringBuilder.toString();
JSONObject jsonObject = null;
try {
jsonObject = new JSONObject(str);
} catch (JSONException e) {
e.printStackTrace();
}
//声明三个变量准备接收数据
String username = null;
String userpay = null;
String userdate = null;
try {
//根据键值就可以取出传入的数据
username= jsonObject.getString("username");
userpay = jsonObject.getString("userpay");
userdate=jsonObject.getString("userdate");
} catch (JSONException e) {
e.printStackTrace();
}
System.out.println("username="+username);
System.out.println("userpay="+userpay);
System.out.println("userdate="+userdate);
}
新手码苗,代码冗余比较大,代码比较臃肿,请各位见谅。
最后一步Servlet接收数据也是在网上看文章学习到的技巧,感谢这位大哥的帖子,附上源地址:利用ajax向服务器发送json格式的数据,以及服务器端的接收和处理