ajax數據請求 JSON對象和字符串

AJAX 可以使網頁實現異步更新，XMLHttpRequest 是 AJAX 的基礎，大部分瀏覽器均支持 XMLHttpRequest 對象（IE5 和 IE6 使用 ActiveXObject）,XMLHttpRequest對象基於HTTP協議用於在後臺與服務器交換數據。
HTTP/1.1 協議規定的 HTTP 請求方法有 OPTIONS、GET、HEAD、POST、PUT、DELETE、TRACE、CONNECT 這幾種。其中 POST 一般用來向服務端提交數據，這裏主要說 POST 提交數據的方式。HTTP 協議是以 ASCII 碼傳輸，建立在 TCP/IP 協議之上的應用層規範。規範把 HTTP 請求分為三個部分：狀態行、請求頭、消息主體。
數據發送出去，需要服務端解析，一般服務端語言如 php、python 等，以及它們的 framework，都內置了自動解析常見數據格式的功能。服務端通常是根據請求頭（headers）中的 Content-Type 字段來獲知請求中的消息主體是用何種方式編碼，再對主體進行解析。所以說到 POST 提交數據方案，包含了 Content-Type 和消息主體編碼方式兩部分。Cntent-Type有以下常見4種類型：
（1） application/x-www-form-urlencoded
這應該是最常見的 POST 提交數據的方式了。瀏覽器的原生 form 表單，如果不設置 enctype 屬性，那麽最終就會以 application/x-www-form-urlencoded 方式提交數據。
（2）multipart/form-data
這又是一個常見的 POST 數據提交的方式。我們使用表單上傳文件時，必須讓 form 的 enctyped 等於這個值。
（3）application/json
現在越來越多的人把它作為請求頭，用來告訴服務端消息主體是序列化後的 JSON 字符串。因為JSON的規範，數據不容易出錯。
（4）text/xml
它是一種使用 HTTP 作為傳輸協議，XML 作為編碼方式的遠程調用規範。

這裏需要註意的是在調用某個接口是，一定要註意接口請求的方式，如果是post，對應的enctype是什麽（即請求時選擇Content-Type為哪種類型）
這裏以某個笑話接口為例，這裏客服端為jquery的ajax，服務端沒有展示：

（1）默認Content-Type 為application/x-www-form-urlencoded：

        $.ajax({
           type: ‘post‘,
            url: ‘http://route.showapi.com/jiekou‘,
            dataType: ‘json‘,
            data: {
                "showapi_appid": ‘666666‘, //這裏需要改成自己的appid
                "showapi_sign": ‘67596029af7b4cb8bc7afe1c6ffd2333‘,  //這裏需要改成自己的應用的密鑰secret
                "page":"1",
                "maxResult":"20"

            },

            error: function(XmlHttpRequest, textStatus, errorThrown) {
                alert("操作失敗!");
            },
            success: function(result) {
                console.log(result) //console變量在ie低版本下不能用
                alert(result.showapi_res_code)
            }
        });

在chorme中調試顯示：

提交的原始數據

（2）content-type:application/json

var jsonstr={
"showapi_timestamp": formatterDateTime(),
"showapi_appid": ‘66666‘, //這裏需要改成自己的appid
"showapi_sign": ‘67596029af7b4cb8bc7afe1c6ffd2333‘, //這裏需要改成自己的應用的密鑰secret
"page":"1",
"maxResult":"20"
}
$(function(){
$(‘#create-user‘).click(function(){
$.ajax({
type: ‘post‘,
url: ‘http://route.showapi.com/341-1‘,
dataType: ‘json‘,
data: JSON.stringify(jsonstr), //轉換為json字符串
contentType:"application/json",
error: function(XmlHttpRequest, textStatus, errorThrown) {
alert("操作失敗!");
},
success: function(result) {
console.log(result) //console變量在ie低版本下不能用
alert(result.showapi_res_code)
}
});
});

在chorme中調試顯示：

客服端提交的原始數據：

補充知識點：
JSON字符串與JSON對象的區別
JSON對象:

var str2 = { "name": "cool", "sex": "man" };

JSON字符串:

var str1 = ‘{ "name": "haha", "sex": "woman" }‘;

js中如何轉換：
1、JSON字符串轉換為JSON對象

var obj = eval(‘(’ + str1+ ‘)’);//eval()函數是js自帶方法
var obj = JSON.parse(str1); //瀏覽器支持的轉換方式
var obj = $.parseJSON( str1);//jQuery方式
var obj = str1.parseJSON();//引用json.js

2、JSON對象轉換為JSON字符串

var s=JSON.stringify(str2); //瀏覽器支持的轉換方式
var s=str2.toJSONString(); //引用json.js

api接口中ajax數據請求與數據返回的小坑