通过jQuery ajax方法前后台传输数据

JS

$.ajax({
	url: "checkName",
	type: "POST",
	data: {"name": "Dannil"},
	dataType: "json",
	success: function(data){
		console.log(data);
        console.log(typeof data);
		console.log(data["token"]);
	},
	beforeSubmit:function () {
	},
	error: function () {
		console.log("fail");
	},
	complete:function () {
		console.log("complete");
	},
})

Java

    @RequestMapping(value = "/checkName")
    public Boolean CheckUser(HttpServletResponse response,
                             HttpServletRequest request) throws IOException {
 
        PrintWriter writer = new PrintWriter(response.getWriter());
        writer.write("{\"token\":1}");
        writer.close();
        return true;
    }

浏览器控制台打印日志

{token: 1}
object
 1
complete

 

需要注意数据格式问题

1、后台构造json格式字符串时，要注意key需要加引号，如下会请求失败，

writer.write("{token:1}");

控制台打印结果

error
complete

2、dataType: "json",去掉，打印如下

{token:1}
string
undefined
complete

因为规定返回数据类型时json格式，所以不满足表示请求失败，执行error方法。

另外需要注意的是，第一次接收的数据类型是object，第二次是string，猜测dataType参数会使字符串转换为JSON对象

3、传递正确的json字符串，并且把dataType参数去掉

{"token":1}
string
undefined
complete

可以看到字符串被原封不动打印出来，并且数据类型是string，所以data["token"]返回值是undefined

4、通过JSON.parse()方法把字符串转换为JSON对象

success: function(data){
	console.log(data);
	console.log(typeof data);
	let obj = JSON.parse(data);
	console.log(typeof obj);
	console.log(obj["token"]);
},

{"token":1}
string
object
1
complete

5、通过fastjson包中的JSONObject构建数据

PrintWriter writer = new PrintWriter(response.getWriter());

Map map = new HashMap();
map.put("token", 1);

JSONObject json = new JSONObject(map);
writer.write(json.toString());
writer.close();

完