Ajax工作原理是
相當(dāng)于在用戶和服務(wù)器之間加了—個(gè)中間層(AJAX引擎),使用戶操作與服務(wù)器響應(yīng)異步化。
對(duì)于用戶請(qǐng)求ajax引擎會(huì)做一些數(shù)據(jù)驗(yàn)證和數(shù)據(jù)處理,不是所有請(qǐng)求都提交給服務(wù)器,當(dāng)需要從服務(wù)器讀取新數(shù)據(jù)時(shí)由Ajax引擎代為向服務(wù)器提交請(qǐng)求。AJAX最大優(yōu)點(diǎn)就是不刷新整個(gè)頁(yè)面的前提下與服務(wù)器通信維護(hù)數(shù)據(jù)。
過(guò)程的話
第一步:創(chuàng)建一個(gè)ajax引擎對(duì)象,ie6的是new ActiveXObject其他瀏覽器是new一個(gè)xmlHttpRequest對(duì)象
第二步 調(diào)用open方法啟動(dòng)一個(gè)請(qǐng)求以備發(fā)送,open方法傳入三個(gè)參數(shù) 請(qǐng)求類(lèi)型,請(qǐng)求url和一個(gè)布爾值
第三步 調(diào)用send方法發(fā)送
第四部 處理回調(diào)函數(shù)onreadystatechange,當(dāng)readState = 4 響應(yīng)數(shù)據(jù)完成時(shí) 并且2status=200請(qǐng)求成功的時(shí)候處理響應(yīng)數(shù)據(jù)
注意:回調(diào)函數(shù)要寫(xiě)在open()和send()之前
Jsonp原理
動(dòng)態(tài)創(chuàng)建一個(gè)script標(biāo)簽,利用script標(biāo)簽src屬性訪問(wèn)沒(méi)有限制,實(shí)現(xiàn)跨域。
web客戶端通過(guò)與調(diào)用腳本一樣的方式來(lái)調(diào)用跨域服務(wù)器上動(dòng)態(tài)生成的js格式文件(后綴.json),服務(wù)器之所以要?jiǎng)討B(tài)生成json文件目的把客戶端需要的數(shù)據(jù)裝入進(jìn)去。
允許用戶傳遞一個(gè)callback參數(shù)給服務(wù)端,然后服務(wù)端返回?cái)?shù)據(jù)時(shí)會(huì)將這個(gè)callback參數(shù)作為函數(shù)名來(lái)包裹住json數(shù)據(jù) 這樣客戶端就可以隨意定制自己的函數(shù)來(lái)自動(dòng)處理返回?cái)?shù)據(jù)
Ajax 和 jsonp的區(qū)別
1.ajax和jsonp的調(diào)用方式很像,目的一樣,都是請(qǐng)求url,然后把服務(wù)器返回的數(shù)據(jù)進(jìn)行處理,因此jquery和ext等框架都把jsonp作為ajax的一種形式進(jìn)行了封裝;
2.實(shí)質(zhì)不同
ajax的核心是通過(guò)xmlHttpRequest獲取非本頁(yè)內(nèi)容
jsonp的核心是動(dòng)態(tài)添加script標(biāo)簽調(diào)用服務(wù)器提供的js腳本(后綴.json)
3.區(qū)別聯(lián)系
不在于是否跨域
ajax通過(guò)服務(wù)端代理一樣跨域
jsonp也不并不排斥同域的數(shù)據(jù)的獲取
4.jsonp是一種方式或者說(shuō)非強(qiáng)制性的協(xié)議
5.jonp只支持get請(qǐng)求,ajax支持get和post請(qǐng)求