Servlet处理（jQuery）Ajax请求
1. jquery
jquery是一个javascript函数库，极大的简化了javascript编程，很容易学习。jquery是目前最流行的开源js框架，并且提供了大量的扩展。
2. ajax
ajax(asynchronous javascript and xml，异步javascript和xml)时一种创建交互式网页应用的网页开发技术，它并不是一项新的技术，其产生的目的是用于实现页面的局部刷新。通过ajax技术可以使之前的应用程序在每次提交时不用进行页面的整体刷新，从而提升操作的性能。
3. get和post
两种最常用的 http 方法是：get 和 post。
定义：get是从指定的资源请求数据，post是从指定的资源提交要被处理的数据。
数据内容：get请求的数据附加在url之后，只允许ascii字符（采用ascii编码），请求的数据会暴露在地址栏中。post请求会把请求的数据放在http请求包的包体中，也允许二进制数据，不会把数据暴露在地址栏。
数据长度：get有限制，在使用get请求时，数据大小会受到url长度的限制（url 的最大长度是 2048 个字符）。post无限制。
安全性：get 的安全性较差（与post相比），因为所发送的数据是 url 的一部分。在发送密码或其他敏感信息时绝不要使用 get ！post 比 get 更安全，因为参数不会被保存在浏览器历史或 web 服务器日志中。
4. jackson
jackson是当前用的比较广泛的，用来序列化和反序列化json的java开源框架。jackson社区相对比较活跃，更新速度也比较快， 从github中的统计来看，jackson是最流行的json解析器之一，spring mvc的默认json解析器便是jackson。
5. servlet处理（jquery）ajax请求（不发送数据/发送key/value数据/发送json数据）
开发环境：eclipse+jsp+jquery+servlet+tomcat+ajax
5.1 servlet处理（jquery）ajax请求（不发送数据，返回普通文本）
(1) 搭建环境：
在eclipse中新建java web项目（会自动导入jre system library包），比如我把项目名字写为ajaxdemo1，并将项目部署到tomcat服务器上，下面是eclipse中项目的目录结构：
我们先不用管lib中的jar包。注意这里有一个jquery-3.2.1.min.js，这是jquery的开发包，我们可以在网上下载，把这个js文件复制粘贴到webcontent目录下即可。下面我会一步一步分析。下面进行开发。
(2) 编写index.jsp文件
1 <%@ page language="java" import="java.util.*" pageencoding="utf-8"%> 2 3 <%-- <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> --%> 4 <% 5 string path = request.getcontextpath(); 6 string basepath = request.getscheme() + "://" + request.getservername() + ":" + request.getserverport() 7 + path + "/"; 8 %> 9 <!doctype html> 10 <html> 11 <head> 12 <base href="<%=basepath%>"> 13 <title>i love you</title> 14 <link rel="stylesheet" type="text/css" href=""> 15 <script type="text/javascript" src="index.js"></script> 16 <script type="text/javascript" src="jquery-3.2.1.min.js"></script> 17 18 19 </head> 20 <body> 21 22 23 <button id="mybutton" value="异步请求服务器" onclick="fun1()" >（jquery）(jquery)ajax请求（不发送数据）</button> 24 <spand id="show" /> 25 26 <br/> 27 <hr/> 28 29 30 <button id="mybutton1" value="异步请求服务器" onclick="fun2()" >发送数据格式为key/value的（jquery）ajax请求</button> 31 <spand id="show1" /> 32 33 <br/> 34 <hr/> 35 <button id="mybutton2" value="异步请求服务器" onclick="fun3()" >发送数据格式为json的(jquery)ajax请求</button> 36 <spand id="show2" /><br/> 37 38 </body>
这里我们实现了三个按钮，并且调用了对应的函数。我们先来看第一个按钮（id="mybutton"）。这个文件引入了2个js文件。一个是我们自己编写的index.js文件，另一个是我们使用jquery框架开发时所用的js文件。我把index.jsp，index.js，jquery-3.2.1.min.js都放在了webcontent目录下（方便操作）。
(3) 编写index.js文件
1 /**
2 *
3 */
4 //使用jquery提交ajax请求（不携带数据）
5 function fun1(){
6
7 $.ajax({
8
9 type:"post", //发送方式
10 url:"ajaxservlet", //请求地址
11 data:"", //数据为空
12 success:function(data){ //成功后的回调函数
13
14 $("#show").html(data); //页面展示内容
15
16 }
17 });
18 }
19
20
21 //使用jquery提交key/value数据（ajax请求）
22
23 function fun2(){
24
25 $.ajax({
26
27 type:"post",
28 url:"ajaxservlet1",
29 data:"username=wly&password=1314520", //key/value数据
30 success:function(data){
31
32 $("#show1").html(data);
33
34 }
35 });
36
37 }
38
39
40 //使用jquery提交json数据（ajax请求）
41
42 function fun3(){
43
44 var user={ //符合json数据格式规范的javascript对象
45 "username":"wly",
46 "password":"1314520"
47 };
48 $.ajax({
49
50 type:"post",
51 url:"ajaxservlet2",
52 contenttype:"application/json;charset=utf-8", //发送数据到服务器时所使用的内容类型
53 data:json.stringify(user), //将javascript对象转化为json字符串
54
55 //预期的服务器响应的数据类型。服务器返回json字符串。jquery会自动把json转化为js对象
56 datatype:"json", //相当于调用json.parse（data）方法。此时我们省去即可。
57 success:function(data){
58
59 $("#show2").html(data.username+" "+data.password);
60
61 }
62 });
63 }
观察fun1()函数，data为空，很简单，代码都有注释，这里不做过多解释。体现出jquery的风格，简单易用。
(4) 编写srvlet文件
package com.servlet;
import java.io.ioexception;
import java.io.printwriter;
import javax.servlet.servletexception;
import javax.servlet.http.httpservlet;
import javax.servlet.http.httpservletrequest;
import javax.servlet.http.httpservletresponse;
public class ajaxservlet extends httpservlet {
protected void doget(httpservletrequest request, httpservletresponse response)
throws servletexception, ioexception {
response.setcontenttype("text/html;charset=utf-8");
printwriter out = response.getwriter();
out.print("我想你了哈哈！");
out.close();
}
protected void dopost(httpservletrequest req, httpservletresponse resp) throws servletexception, ioexception {
this.doget(req, resp);
}
}
代码很简单，就返回一句话（普通文本）。没啥好说的。
(5) web.xml文件配置servlet
<?xml version="1.0" encoding="utf-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/xmlschema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemalocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="webapp_id" version="3.0">
<display-name>ajaxdemo</display-name>
<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>index.jsp</welcome-file>
<welcome-file>default.html</welcome-file>
<welcome-file>default.htm</welcome-file>
<welcome-file>default.jsp</welcome-file>
</welcome-file-list>
<servlet>
<servlet-name>ajaxservlet</servlet-name>
<servlet-class>com.servlet.ajaxservlet</servlet-class>
</servlet>
<servlet>
<servlet-name>ajaxservlet1</servlet-name>
<servlet-class>com.servlet.ajaxservlet1</servlet-class>
</servlet>
<servlet>
<servlet-name>ajaxservlet2</servlet-name>
<servlet-class>com.servlet.ajaxservlet2</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>ajaxservlet</servlet-name>
<url-pattern>/ajaxservlet</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>ajaxservlet1</servlet-name>
<url-pattern>/ajaxservlet1</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>ajaxservlet2</servlet-name>
<url-pattern>/ajaxservlet2</url-pattern>
</servlet-mapping>
</web-app>
配置很简单。这里不用多说。这篇相当于是ajax的进阶版。不懂的话可以看我第一篇博客：servlet处理原生ajax请求
(6) 运行程序
启动tomcat，在浏览器上输入地址，点击按钮，运行效果如下：
5.2 servlet处理（jquery）ajax请求（发送key/value数据，返回普通文本）
(1)编写jsp文件
上面的index.jsp文件已经写好了，看第二个按钮就行了。
(2)编写js文件
上面index.js已经写好了，注意看fun2()函数，发送的是key/value类型数据。
(3)编写servlet文件
1 package com.servlet;
2
3 import java.io.ioexception;
4 import java.io.printwriter;
5
6 import javax.servlet.servletexception;
7 import javax.servlet.http.httpservlet;
8 import javax.servlet.http.httpservletrequest;
9 import javax.servlet.http.httpservletresponse;
10
11 public class ajaxservlet1 extends httpservlet {
12
13 protected void doget(httpservletrequest request, httpservletresponse response)
14 throws servletexception, ioexception {
15
16 response.setcontenttype("text/html;charset=utf-8");
17 printwriter out = response.getwriter();
18 string username = request.getparameter("username");
19 string password = request.getparameter("password");
20 system.out.println(username + " " + password);
21 out.print("helloworld " + "username:" + username + " password:" + password);
22 out.close();
23
24 }
25
26 protected void dopost(httpservletrequest req, httpservletresponse resp) throws servletexception, ioexception {
27 this.doget(req, resp);
28 }
29 }
使用request.getparameter(string stringparam)接受客户端传来的数据。返回一个连接字符串。
(4)web.xml文件配置servlet
上面已经配置好了，这里不多说。
(5)运行程序
5.3 servlet处理（jquery）ajax请求（发送json数据，返回json数据）
（1）导入jackson的jar包
jackson是用来解析json数据的第三方类库，通过上面项目目录我们发现，在lib下由三个jaskson相关开发包。jackson核心模块由这三部分组成：
1. jackson-core 核心包，提供基于”流模式”解析的相关 api，它包括 jsonpaser 和 jsongenerator。jackson 内部实现正是通过高性能的流模式 api 的 jsongenerator 和 jsonparser 来生成和解析 json。
2. jackson-annotations 注解包，提供标准注解功能；
3. jackson-databind 数据绑定包，提供基于”对象绑定” 解析的相关 api（ objectmapper ）和”树模型” 解析的相关 api（jsonnode）；基于”对象绑定” 解析的 api 和”树模型”解析的 api 依赖基于”流模式”解析的 api。
有兴趣的话可以研究一下源码，这里就不多说了。这里我们发现使用jackson导入的jar包比较少（相比于json-lib）。
（2）新建实体user类
1 package com.entity;
2
3 public class user {
4
5 private string username;
6
7 private string password;
8
9 public string getusername() {
10 return username;
11 }
12
13 public void setusername(string username) {
14 this.username = username;
15 }
16
17 public string getpassword() {
18 return password;
19 }
20
21 public void setpassword(string password) {
22 this.password = password;
23 }
24
25 @override
26 public string tostring() {
27 return "user [username=" + username + ", password=" + password + "]";
28 }
29
30 }
简单易懂，不多说。
（3）编写jsp文件
上面已经写好，看第三个按钮就行了。
（4）编写js文件
看fun3()函数就可以了，代码有注释。注意这块由个contenttype属性，发送数据到服务器所使用的内容类型，这里我们设置的是contenttype:"application/json;charset=utf-8"。指定发送数据格式为json格式，字符编码为utf-8。还有一个datatype属性，我们设置为“json”，当服务器响应成功时，我们调用回调函数，相当于预期知道服务器响应的数据类型，就可以自动的把json字符串转化为javascript对象。相当于json.parse(data)方法。这里我们省略掉了这个方法，因为jquery已经帮我们格式化好了。
（5）编写servlet文件
第一步，先编写jackson的工具类。
1 package com.util;
2
3 import java.io.bufferedreader;
4 import java.io.ioexception;
5 import java.io.inputstreamreader;
6 import java.io.unsupportedencodingexception;
7
8 import javax.servlet.http.httpservletrequest;
9
10 import com.entity.user;
11 import com.fasterxml.jackson.databind.objectmapper;
12
13 public class jsonreader {
14
15 public static user receivepost(httpservletrequest request) throws unsupportedencodingexception, ioexception {
16
17 // 读取请求内容
18 bufferedreader br = new bufferedreader(new inputstreamreader(request.getinputstream(), "utf-8"));
19
20 string line = null;
21 stringbuilder sb = new stringbuilder();
22
23 while ((line = br.readline()) != null) {
24 sb.append(line);
25 }
26
27 // 将json字符串转化为java对象
28 objectmapper json = new objectmapper();
29 user user = json.readvalue(sb.tostring(), user.class);
30 return user;
31 }
32
33 }
第二步，编写servlet
1 package com.servlet;
2
3 import java.io.ioexception;
4
5 import javax.servlet.servletexception;
6 import javax.servlet.http.httpservlet;
7 import javax.servlet.http.httpservletrequest;
8 import javax.servlet.http.httpservletresponse;
9
10 import com.entity.user;
11 import com.fasterxml.jackson.databind.objectmapper;
12 import com.util.jsonreader;
13
14 public class ajaxservlet2 extends httpservlet {
15
16 protected void doget(httpservletrequest request, httpservletresponse response)
17 throws servletexception, ioexception {
18
19 // response.setcontenttype("text/html;charset=utf-8");
20
21 response.setcontenttype("application/json;charset=utf-8");
22
23 user user = jsonreader.receivepost(request);
24
25 system.out.println(user);
26
27 objectmapper mapper = new objectmapper();
28
29 // 将java对象转化为json字符串
30 string json = mapper.writevalueasstring(user);
31
32 system.out.println(json);
33 response.getwriter().print(json);
34
35 }
36
37 protected void dopost(httpservletrequest req, httpservletresponse resp) throws servletexception, ioexception {
38 this.doget(req, resp);
39 }
40 }
我们注意到有个objectmapper类，objectmapper是json操作的核心，jackson的所有json操作都是在objectmapper中实现。它位于jackson-databind-2.0.0-jar里面。这里我们介绍objectmapper类下常用到的方法。 public <t> t readvalue(jsonparser jp, class<t> valuetype)这个方法可以将json字符串转化为java对象。public string writevalueasstring(object value)这个方法可以将java对象转化为json字符串。先介绍用到的这2个方法。其他的自己看看源码。
（6）web.xml文件配置servlet
同理，上面已经配置好了。这里不多说。
（7）跑一下程序
6. 总结
（1）使用jquery使代码更加简洁，易懂易用（jquery轻量级）。
（2）jquery将所有的ajax操作封装到一个函数$.ajax()里，使得开发者处理ajax的时候能够专心处理业务逻辑而无需关心复杂的浏览器兼容性和xmlhttprequest对象的创建和使用的问题。jquery的ajax操作比较完善。
（3）jackson性能分析：
1. jackson 所依赖的jar包较少，简单易用。
2.与其他 java 的 json 的框架 gson 等相比，jackson 解析大的 json 文件速度比较快。
3. jackson 运行时占用内存比较低，性能比较好
4. jackson 有灵活的 api，可以很容易进行扩展和定制。
本篇博客源码链接：https://pan.baidu.com/s/1qn1gadckviiwkicitixegg 提取码：nuip
上一篇： 科学计算库Numpy——数组形状
下一篇： js 三大家族之offset