建站
咨詢
售后
建站咨詢
新聞中心
這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
前端學(xué)習(xí)之a(chǎn)jax
一、什么是json
JSON(JavaScript Object Notation, JS 對象標(biāo)記) 是一種輕量級的數(shù)據(jù)交換格式。
它基于 ECMAScript (w3c制定的js規(guī)范)的一個(gè)子集，采用完全獨(dú)立于編程語言的文本格式來存儲和表示
數(shù)據(jù)。簡潔和清晰的層次結(jié)構(gòu)使得 JSON 成為理想的數(shù)據(jù)交換語言。 易于人閱讀和編寫，同時(shí)也易于
機(jī)器解析和生成，并有效地提升網(wǎng)絡(luò)傳輸效率。
json類型是js類型的子集
json對象到j(luò)son字符串是序列化過程，json字符串到j(luò)son對象是反序列化過程
python的json模塊，json.dumps(對象)，序列化，json.loads(json字符串)反序列化
合格的json對象：
["one", "two", "three"]
{ "one": 1, "two": 2, "three": 3 }
{"names": ["張三", "李四"] }
[ { "name": "張三"}, {"name": "李四"} ]
不合格的json對象
{ name: "張三", 'age': 32 } // 屬性名必須使用雙引號[32, 64, 128, 0xFFF] // 不能使用十六進(jìn)制值
{ "name": "張三", "age": undefined } // 不能使用undefined
{ "name": "張三", "birthday": new Date('Fri, 26 Aug 2011 07:13:10 GMT'), "getName": function() {return this.name;} // 不能使用函數(shù)和日期對象}
stringify和parse方法
JSON.parse(): 用于將json字符串轉(zhuǎn)化為javascript對象
console.log(JSON.parse('{"name":"Yuan"}'));
console.log(JSON.parse('{name:"Yuan"}')) ; // 錯(cuò)誤
console.log(JSON.parse('[12,undefined]')) ; // 錯(cuò)誤
JSON.stringify(): 用于將javascript對象轉(zhuǎn)化為JSON字符串
console.log(JSON.stringify({'name':"egon"})) ;
二、ajax
同步交互：客戶端發(fā)出一個(gè)請求后，需要等待服務(wù)器響應(yīng)結(jié)束后，才能發(fā)出第二個(gè)請求；
異步交互：客戶端發(fā)出一個(gè)請求后，無需等待服務(wù)器響應(yīng)結(jié)束，就可以發(fā)出第二個(gè)請求。
AJAX除了異步的特點(diǎn)外，還有一個(gè)就是：瀏覽器頁面局部刷新；（這一特點(diǎn)給用戶的感受是在不知不覺
中完成請求和響應(yīng)過程）
ajax優(yōu)缺點(diǎn)
優(yōu)點(diǎn):
1、ajax異步請求
2、ajax無需刷新整個(gè)頁面
3、因?yàn)榉?wù)器響應(yīng)內(nèi)容不再是整個(gè)頁面，而是頁面中的局部，所以AJAX性能高；
缺點(diǎn):
1、AJAX并不適合所有場景，很多時(shí)候還是要使用同步交互；
2、AJAX雖然提高了用戶體驗(yàn)，但無形中向服務(wù)器發(fā)送的請求次數(shù)增多了，導(dǎo)致服務(wù)器壓力增大；
3、因?yàn)锳JAX是在瀏覽器中使用Javascript技術(shù)完成的，所以還需要處理瀏覽器兼容性問題；
ajax語法
$.ajax({
url:"/handle_Ajax/",
type:"POST",
data:{username:"Yuan",password:123},
success:function(data){
alert(data)
}
}）
data: 當(dāng)前ajax請求要攜帶的數(shù)據(jù)，是一個(gè)json的object對象，ajax方法就會默認(rèn)地把它編碼成某種格式
(urlencoded:?a=1&b=2)發(fā)送給服務(wù)端；此外，ajax默認(rèn)以get方式發(fā)送請求。
contentType：默認(rèn)值: "application/x-www-form-urlencoded"。發(fā)送信息至服務(wù)器時(shí)內(nèi)容編碼類型。
用來指明當(dāng)前請求的數(shù)據(jù)編碼格式；urlencoded:?a=1&b=2；如果想以其他方式提交數(shù)據(jù)，
比如contentType:"application/json"，即向服務(wù)器發(fā)送一個(gè)json字符串：
$.ajax("/ajax_get",{
data:JSON.stringify({
a:22,
b:33
}),
contentType:"application/json",
type:"POST",
}); //{a: 22, b: 33}
注意：contentType:"application/json"一旦設(shè)定，data必須是json字符串，不能是json對象csrf跨站請求偽造
$.ajaxSetup({
data: {csrfmiddlewaretoken: '{{ csrf_token }}' },
})
django 接受 ajax 傳來的數(shù)組對象
發(fā)送：ajax 通過 POST 方式傳來一個(gè)數(shù)組
接收：django 接受方式
array = request.POST.getlist(‘key[]’)
其中，key為包含該數(shù)組的鍵值對的鍵。
尤其要注意“[]”，少了它將不能接受成功
為什么要加”[]”？
分析前臺發(fā)送數(shù)據(jù)，我們會發(fā)現(xiàn)：ajax自動(dòng)給數(shù)組中的數(shù)據(jù)的鍵名后添加了”[]”
標(biāo)題名稱：前端學(xué)習(xí)之a(chǎn)jax
標(biāo)題網(wǎng)址：http://www.ef60e0e.cn/article/ihiiph.html
