ajax請求從js傳json數據到后場及接受方式—用或者不用RequestBody的情況及后場返回

前端參數可以直接使用JSON對象：

//此時請求的ContentType默認是application/x-www-form-urlencoded：
var user= {
                "username" : username,
                "password" : password,
                "rememberMe":rememberMe
          };
$.ajax({
    url : "http://...../jsontest.do",
    type : "POST",
    async : true,
    data : user,
    dataType : 'json',//返回類型
    success : function(data) {
    }
});

 

后端參數的可以用java對象接收，也可以用數據類型單獨接收：

@RequestMapping("/jsontest.do")
public void test(User user,String username,String password,Boolean rememberMe){
    System.out.println(user);
    System.out.println("username: " + username);
    System.out.println("password: " + password);
    System.out.println("rememberMe: " + rememberMe);
    
}

 

2.而使用RequestBody是這樣的：

參考：https://blog.csdn.net/walkerJong/article/details/7520896

作用：

      i) 該注解用於讀取Request請求的body部分數據，使用系統默認配置的HttpMessageConverter進行解析，然后把相應的數據綁定到要返回的對象上；

      ii) 再把HttpMessageConverter返回的對象數據綁定到 controller中方法的參數上。

使用時機：

A) GET、POST方式提時， 根據request header Content-Type的值來判斷:

    application/x-www-form-urlencoded， 可選（即非必須，因為這種情況的數據@RequestParam, @ModelAttribute也可以處理，當然@RequestBody也能處理）；
    multipart/form-data, 不能處理（即使用@RequestBody不能處理這種格式的數據）；
    其他格式， 必須（其他格式包括application/json, application/xml等。這些格式的數據，必須使用@RequestBody來處理）；
B) PUT方式提交時， 根據request header Content-Type的值來判斷:

    application/x-www-form-urlencoded， 必須；
    multipart/form-data, 不能處理；
    其他格式， 必須；
說明：request的body部分的數據編碼格式由header部分的Content-Type指定；

前端使用application/json的時候，必須要將JSON對象轉換為JSON字符串

//需要使用JSON.stringify()將JSON對象轉化為JSON字符串
var user= {
                "username" : username,
                "password" : password
          };
$.ajax({
        url : "http://...../jsontest.do",
        type : "POST",
        async : true,
        contentType: "application/json; charset=utf-8",//將JSON對象轉換為JSON字符串
        data : JSON.stringify(user),
        dataType : 'json',
        success : function(data) {
        }
 });

　　

后端參數要用@RequestBody注解加java對象/map對象/字符串 接收，如果請求的地址后面有參數，則形參可以新增該參數的接收：

//這種方式下所有的參數都只能封裝在User對象中，不能單獨設置參數
@RequestMapping("/jsontest")
//用java對象接收
public void test(@RequestBody User user  ){
    String username = user.getUsername();
    String password = user.getPassword();
}

或者

@RequestMapping("/jsontest")
//用map對象接收，再從map對象中根據key值獲取value值
public void test(@RequestBody Map map  ){
    String username = map.get("username").toString();
    String password = map.get("password").toString();
}

或者

 public void test(@RequestBody String jsonData) {
//用字符串接收，再將字符串轉為json對象，最后再解析為具體的對象
    JSONObject jsonObject = JSON.parseObject(jsonData);
    String username= jsonObject.getString("username");
    String username= jsonObject.getString("password");
 }

 

第1種有以下優點： 
1.前端傳遞數據不用轉換為json字符串：即不用JSON.stringify(user) 
2.后端接受的參數很靈活，即可以封裝為User對象，亦可以使用單個參數username,rememberMe，甚至User對象和單個rememberMe參數混合使用都可以

第2種優點：

1.前端ajax請求傳入比較復雜的數據格式時，用@RequestBody注解比較好（個人理解）

2.使用@RequestBody時，在ajax請求的地址后邊也可以加上參數，然后在后台的controller參數中獲取

例如

{
var params = {
        id:id,
        taskPhones:taskPhones,
        groupId:groupId,
        planType:planType,
        scheduledTimeStr:scheduledTimeStr,
        taskName:taskName,
        templateContent:templateContent,
        templateId:templateId,
        taskTemplateValueList:taskTemplateValueList,
        smilResourceId:smilResourceId,
    }

    submit(params, '0');
}

function submit(params,isTemp){
    $.ajax({
        url: WEB_ROOT + "/mall/task/saveTaskForEdit?isTemp="+isTemp,
        type : "POST",
        dataType : "JSON",
        contentType:"application/json",
        data: JSON.stringify(params),
        success: function (data) {
            if (data.success) {
                var taskId=data.data;
                msgInfoModal("成功",'保存成功',function () {
                    window.location = WEB_ROOT + "/mall/task/taskIndex";
                    // window.location = WEB_ROOT + "/mall/task/editTask?id=" + taskId;
                },true);
                tab.alertReload('成功','保存成功',false,"toEdit("+demandId+")");
            } else {
                msgInfoModal("失敗",data.msg);
            }
        }
    });
}

 

3.@ResponeBody的用法