1. 程式人生 > >ajax Form提交與Payload提交

ajax Form提交與Payload提交

不可 技術 t對象 ajax 數據類型 url 提交 解析 func

後端處理前端提交的數據時,既可以使用Form解析,也可以使用JSON解析Payload字符串。

Form解析可以直接從Request對象中獲取請求參數,這樣對象轉換與處理相對容易,但在大片JSON數據需要提交時,可能會出現大量的數據拆分與處理工作,另外針對集合類型的處理,也是其比較孱弱的地方。

而Payload的優勢是一次可以提交大量JSON字符串,但無法從Request從獲取參數,也會受限於JSON解析的深度(尤其是有多層對象級聯的情況,最底層的對象幾乎無法轉換為具體類型)。

以Chrome瀏覽器為例,它們提交時的網絡參數截圖如下所示:

form 提交方式:
技術分享圖片

以下是Payload的提交方式:
技術分享圖片

具體到是實現上,$.ajax默認的實現方式就是Form提交,核心在於contentType的設置上,如下:

var data =  {
    name : abc
};
//  提交數據
$.ajax(app/, {
    method:POST,
    //  將數據編碼為表單模式
    contentType:application/x-www-form-urlencoded; charset=UTF-8,
    //  數據必須為JS對象,不可是字符串
    data : data,
    success : function(datas) {
        console.log(datas)
    }
})

而Payload提交方式的實現如下:

$.ajax(app/, {
    //  據我測試了多次,payload只能用於POST方式
    method:POST,
    //  數據類型必須為application/x-www-form-urlencoded之外的類型
    contentType:application/json;charset=utf-8, charset=UTF-8,
    //  數據必須轉換為字符串
    data : JSON.stringify(data),
    success : function(datas) {
        console.log(datas)
    }
})

ajax Form提交與Payload提交