SpringBoot中前后端數據交互 json 格式


//前端使用jquery封裝的ajax技術把封裝好的json數據傳輸給后端
//而在springboot項目中后端自動配置使用了google的jackson把傳遞給前端的數據自動轉換為json格式,當然我們也可以不用默認,自定義設置

$.ajax(
{
    url:"http://www.microsoft.com",    //請求的url地址
    dataType:"json",   //返回格式為json
    async:true,//請求是否異步,默認為異步,這也是ajax重要特性
    data:{"id":"value"},    //參數值
    type:"POST",   //請求方式
    contentType: 'application/json;charset=utf-8' ,指定數據是以Json的形式傳遞
    beforeSend:function(){
        //請求前的處理
    },
    success:function(req){
        //請求成功時處理
    },
    complete:function(){
        //請求完成的處理
    },
    error:function(){
        //請求出錯處理
    }
}
);




//前端定義一個數組,把他轉換為 json 格式
function arr(){
  //定義一個數組 
  var cons = new Array(3); 
  for(var i = 0;i<3;i++){
    var con = {};
    con["id"] = 0;
    con["name"] = '張三';
    con["job"] = '學生';
    cons[i] = con;
  }
  var json = JSON.stringify(cons);
  alert("json數組為:"+json);    
}



//前端定義一個對象把他轉化為json格式
function demo(){
  var con = {};
  con["id"] = 0;
  con["name"] = '張三';
  con["job"] = '學生';
  var json = JSON.stringify(con);          
  alert("封裝成json數據為:"+json);  
}


////////////////////原理講解///////////////////////////
在數據傳輸過程中,JSON是以文本、即字符串的形式傳遞的,而JavaScript操作的是JSON對象,所以,JSON對象和JSON字符串之間的相互轉換是關鍵。
JSON字符串:var str = "{name:'xmt',sex:'woman'}";
JSON對象:var str = {name:'xmt',sex:'woman'};

JSON字符串轉化為JSON對象:var obj = JSON.parse(str);
JSON對象轉化為JSON字符串:var str = JSON.stringify(obj);

在整理博客的時候突發奇想一個問題,前端傳輸的是 JSON 對象,或者 JSON 字符串到后端有什么區別呢???存取有什么不同???

經過測試我發現一般我們進行前后端數據交互時都是用 json字符串 形式進行交互,把json字符串傳給后端,后端再應用jackson或者fastjson等json轉換工具,把json字符串轉換為相對於的json對象

經過接近一整天的測試我了解到,前端通過ajax傳值到后端的話,一般都是通過json字符串的形式進行傳遞,並且contentType參數絕對不能設置為application/json,不然后端是取不到這個參數的,我們只能通過在后端用fastjson來轉換json字符串為對應的json對象,在springboot中返回給ajax的data數據只需要通過方法的@ResponseBody注解進行返回即可,返回的數據springboot會自己轉化為json的格式十分方便

<button id="ibutton">提交</button>

<div id="content"></div>


<script type="text/javascript">
    var studentList = [];
    for (var i = 0; i < 3; i++) {
        var student = {};
        student["name"] = 'yuqiliu';
        student["sex"] = 'false';
        student["age"] = '20';
        studentList.push(student);
    }
    $("#ibutton").click(function () {
       $.ajax(
           {
               url: "/index2",
               data: {
                   'studentListStr': JSON.stringify(studentList)
               },
               dataType: "json",
               type: "POST",
               success: function (data) {


                    $("#content").html(
                        "<table>"+
                        "<th>" +
                            "<td>姓名</td>"+
                            "<td>年齡</td>"+
                            "<td>性別</td>"+
                        "</th>"+
                        "<tr>" +
                            "<td>"+data[0].name+"</td>"+
                            "<td>"+data[0].age+"</td>"+
                            "<td>"+(data[0].sex)+"</td>"+
                        "</tr>"+
                        "<tr>" +
                            "<td>"+data[1].name+"</td>"+
                            "<td>"+data[1].age+"</td>"+
                            "<td>"+data[1].sex+"</td>"+
                        "</tr>"+
                        "<tr>" +
                            "<td>"+data[2].name+"</td>"+
                            "<td>"+data[2].age+"</td>"+
                            "<td>"+data[2].sex+"</td>"+
                        "</tr>"+
                        "</table>"
                    )
                   console.log(data[0].name);
               }
           }
       );
    });


</script>

fastjson對象,JSON,字符串,map之間的互轉

1.對象與字符串之間的互轉

將對象轉換成為字符串
String str = JSON.toJSONString(infoDo);
字符串轉換成為對象
InfoDo infoDo = JSON.parseObject(strInfoDo, InfoDo.class);

2.對象集合與字符串之間的互轉

將對象集合轉換成為字符串
String users = JSON.toJSONString(users);
將字符串轉換成為對象集合
List<User> userList = JSON.parseArray(userStr, User.class);  

3.字符串互轉JSONObject

String 轉 Json對象
JSONObject jsonObject = JSONObject.parseObject(jsonString);
json對象轉string
JSONObject jsonObject = JSONObject.parseObject(str);//json對象轉字符串 
String jsonString = jsonObject.toJSONString();

4.map與字符串之間互轉

 //字符串轉map
  JSONObject  jsonObject = JSONObject.parseObject(str);
  Map<String,Object> map = (Map<String,Object>)jsonObject;//    //json對象轉Map
  //map轉字符串
  String jsonString = JSON.toJSONString(map);

5.Map 轉 Json對象

//map轉json對象
    Map<String,Object> map = new HashMap<>();
    map.put("age", 24);
    map.put("name", "cool_summer_moon");
    JSONObject json = new JSONObject(map);
  //json對象轉Map 
  Map<String,Object> map = (Map<String,Object>)jsonObject;


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM