$.ajax 中的contentType

在 cnodejs.org 論壇中有一個問題，讓我也很奇怪，說是 $.ajax 設(shè)置數(shù)據(jù)類型 applicaiton/json之后，服務(wù)器端(express)就拿不到數(shù)據(jù)，好奇之下，就去翻了翻資料，發(fā)現(xiàn)了一個自己也沒有注意到的事。

于是有了這篇文章。

正文

$.ajax contentType 和 dataType , contentType 主要設(shè)置你發(fā)送給服務(wù)器的格式，dataType設(shè)置你收到服務(wù)器數(shù)據(jù)的格式。

在http 請求中，get 和 post 是最常用的。

在 jquery 的 ajax 中， contentType都是默認的值：application/x-www-form-urlencoded，這種格式的特點就是，name/value 成為一組，每組之間用 & 聯(lián)接，而 name與value 則是使用 = 連接。

如： wwwh.baidu.com/q?key=fdsa&lang=zh 這是get , 而 post 請求則是使用請求體，參數(shù)不在 url 中，在請求體中的參數(shù)表現(xiàn)形式也是: key=fdsa&lang=zh的形式。

鍵值對這樣組織在一般的情況下是沒有什么問題的，這里說的一般是，不帶嵌套類型JSON，也就是 簡單的JSON，形如這樣：

{
    a: 1,
    b: 2,
    c: 3
}

但是在一些復雜的情況下就有問題了。

例如在 ajax 中你要傳一個復雜的 json 對像，也就說是對象嵌數(shù)組，數(shù)組中包括對象，兄果你這樣傳：

{
  data: {
    a: [{
      x: 2
    }]
  }
}

這個復雜對象， application/x-www-form-urlencoded 這種形式是沒有辦法將復雜的 JSON 組織成鍵值對形式(當然也有方案這點可以參考 ) ,你傳進去可以發(fā)送請求，但是服務(wù)端收到數(shù)據(jù)為空， 因為 ajax 沒有辦法知道怎樣處理這個數(shù)據(jù)。

這怎么可以呢？

聰明的程序員發(fā)現(xiàn) http 還可以自定義數(shù)據(jù)類型，于是就定義一種叫 application/json 的類型。

這種類型是 text ， 我們 ajax 的復雜JSON數(shù)據(jù)，用 JSON.stringify序列化后，然后發(fā)送，在服務(wù)器端接到然后用 JSON.parse 進行還原就行了，這樣就能處理復雜的對象了。

$.ajax({
    dataType: 'json',
    contentType: 'application/json',
    data: JSON.stringify({a: [{b:1, a:1}]})
})

這樣你就可以發(fā)送復雜JSON的對象了。像現(xiàn)在的 restclient 都是這樣處理的。

總結(jié)

以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。

最新評論