前端使用Ajax傳值到後端

程式碼示例如下：

var postData = [];
var json1 = {"a":"a","b":"b"};
var jsonArray = [{"id":"a","name":"zrxJuly"},{"id":"b","name":"Anna"},{"id":"c","name":"Andy"}];
postData.push({"json1":json1});
postData.push({"jsonArray":jsonArray});
$.ajax({
    type : "post",
    url : "/test",
    data :
 
 {testData:JSON.stringify(postData)},
    dataType : "json",
    success : function(data) {
        console.log('成功後的回撥函式');
    },
    error : function() {
        console.log('失敗後的回撥函式');
    }
});

後端接收前端傳來的資料

後端SpringBoot接收前端資料及處理,使用Gson解析json.

@PostMapping(value = "/test", produces =
 
 { MediaType.APPLICATION_JSON_UTF8_VALUE })
public void test(String testData) throws Exception {
    // JSON資料格式：
    // [{"A":"Anna","B":"Bob"},{"json1":{"A":"a","B":"b"}},{"jsonArray":[{"A":"a","B":"zrxJuly"},{"A":"b","B":"Anna"},{"A":"c","B":"Andy"}]}]
    
    //String testData = "[{\"A\":\"Anna\",\"B\":\"Bob\"},{\"json1\":{\"A\":\"a\",\"B\":\"b\"}},{\"jsonArray\":[{\"A\":\"a\",\"B\":\"zrxJuly\"},{\"A\":\"b\",\"B\":\"Anna\"},{\"A\":\"c\",\"B\":\"Andy\"}]}]";
 

    System.out.println("=================獲取的json：=============");
    System.out.println(testData);
    // 1.將該json陣列字串轉化為json陣列物件.
    JSONArray dataJson = JSONArray.fromObject(testData);
    // 獲取陣列元素,陣列內元素都是json.
    // 獲取第一種json.
    System.out.println("======獲取第一種json:"+dataJson.get(0));
    // 對映為物件.
    Json1 json1 = new Gson().fromJson(dataJson.get(0).toString(), Json1.class);
    System.out.println(json1.getA());
    System.out.println(json1.getB());
    System.out.println(json1.toString());
    // 獲取第二種json. key:value形式.
    System.out.println("======獲取第二種json. key:value形式："+dataJson.get(1));
    // 將獲取的值解析為Json物件.
    JsonObject jsonObject2 = (JsonObject) new JsonParser().parse(dataJson.get(1).toString());
    // 對映為物件.
    Json1 json11 = new Gson().fromJson(jsonObject2.get("json1"), Json1.class);
    System.out.println(json11.getA());
    System.out.println(json11.getB());
    System.out.println(json11.toString());
    // 獲取第三種json：json陣列
    System.out.println("======獲取第三種json：json陣列："+dataJson.get(2));
    JsonObject jsonObject3 = (JsonObject) new JsonParser().parse(dataJson.get(2).toString());
    List<Json1> json1List = new Gson().fromJson(jsonObject3.get("jsonArray"), new TypeToken<List<Json1>>() {}.getType());
    for (int i = 0; i < json1List.size(); i ++) {
        System.out.println(json1List.get(i).getA()+":"+json1List.get(i).getB());
    }
}

在解析json取值前，我們需要將json物件對映為我們實體類中的物件,需要建立json的對映Bean.

/**
 * @author zrxJuly
 * @Description json的對映Bean.
 */
public class Json1 {
    private String A;
    private String B;
    public String getA() {
        return A;
    }
    public void setA(String a) {
        A = a;
    }
    public String getB() {
        return B;
    }
    public void setB(String b) {
        B = b;
    }
    @Override
    public String toString() {
        return "Json1 [A=" + A + ", B=" + B + "]";
    }
    
}

輸出結果如下：