ajax-post参数传递方式

今天在写一个测试的ajax请求的时候，突然忘记了怎么用request body 传参。借这个机会，总结一下。当从前端通过ajax向后台发起一个post请求时，一共有三种方式传递参数。

通过url传递参数

ajax：通常采用形如以下的js代码。这样实质上是拼成了这样一个url : http://lefer.cn/getUserInfo?username=lefer

$.post({
	url: "http://lefer.cn/getUserInfo",
	data: {
      username:"lefer",
    },
	success: function( result ) {
      alert(result);
    }
}),

java：通常在controller中采用形如以下的代码来接受参数。

@RequestMapping("/getUserInfo")
public void getUserInfo(@RequestParam String username){
  System.out.println(username);
}

这种方式是最常用的方式。每一个参数都是独立的，通常表单都是按照这种形式提交。

通过request body传递参数

ajax：通常采用形如以下的js代码。在http request中，参数其实存放在 Request Payload 区域。

$.post({
	url: "http://lefer.cn/getUserInfo",
    contentType: 'application/json',
	data: JSON.stringify({
      username:"lefer",
    }),
    dataType:"json",
	success: function( result ) {
      alert(result);
    }
}),

java：通常在controller中采用形如以下的代码来接受参数。

@RequestMapping("/getUserInfo")
public void getUserInfo(@RequestBody Map map){
  System.out.println(map.get("username"));
}

这种方式后端接受到的是一个序列化后的json字符串。

ajax：通常采用形如以下的js代码。

$.post({
	url: "http://lefer.cn/getUserInfo",
    headers : {"Authorization":"Bearer dfdfd",
			   "Content-Type": "application/json; charset=utf-8",
               "username":"lefer"},
	data: {},
	success: function( result ) {
      alert(result);
    }
}),

java：通常在controller中采用形如以下的代码来接受参数。

@RequestMapping("/getUserInfo")
public void getUserInfo(httpServletRequest request){
  System.out.println(request.getHeader("username"));
}

这种方式不太建议使用，http header 中的信息很容易在处理中丢失，比如在应对跨域请求的时候或者某些网关处理

ajax-post参数传递方式

通过url传递参数

通过request body传递参数

通过header传递参数

END