先前因?yàn)闆](méi)工作需要,不存在需要跨域訪問(wèn)的應(yīng)用,一直沒(méi)接觸過(guò)JSONP,只是了解個(gè)大概意思,即是插入一個(gè)SCRIPT標(biāo)簽,設(shè)置src,讓瀏覽器加載并自動(dòng)運(yùn)行,但具體怎么過(guò)程,有什么常見(jiàn)的約定等等不甚了解,今天有機(jī)會(huì)接觸了,具體說(shuō)一下.

　　1. 其實(shí)JSONP也是一個(gè)”hack”應(yīng)用

　　由于以前的應(yīng)用沒(méi)現(xiàn)在這么復(fù)雜,跨域訪問(wèn)瀏覽器端沒(méi)提供標(biāo)準(zhǔn)的方法(可能那時(shí)還根本沒(méi)考慮過(guò)..),當(dāng)各種應(yīng)用不斷的豐富之后,需求也隨之而來(lái)了,既然需求來(lái)了,但瀏覽器沒(méi)提供直接的實(shí)現(xiàn),此時(shí)就只能根據(jù)已有功能,玩些雕蟲(chóng)小技,待轉(zhuǎn)幾個(gè)彎,兜幾個(gè)圈之后,JSONP就出來(lái)了.

　　2. hack的背后實(shí)現(xiàn)

　　瀏覽器加載標(biāo)簽的靜態(tài)資源是可以跨域訪問(wèn)的,如常見(jiàn)的 link:href, script:src,img:src等等,沒(méi)有安全限制,可直接訪問(wèn),JSONP正是利用了這個(gè)特點(diǎn),加載不同域上的腳本文件.

　　待把腳本script標(biāo)簽插入DOM上的head標(biāo)簽內(nèi),并設(shè)置好src屬性時(shí),瀏覽器就開(kāi)始加載腳本,腳本下載完后直接運(yùn)行返回的文本內(nèi)容.

　　3. 我們需要的是數(shù)據(jù)而非源碼

　　hack的過(guò)程已經(jīng)了解,但目前為止作用不大,因?yàn)闉g覽器連接返回后獲得資源就是JavaScript源碼,并會(huì)立即執(zhí)行這些源碼,你無(wú)法異想天開(kāi)的將這文本放到一個(gè)可控的eval里運(yùn)行之后獲得結(jié)果.假如這源碼是任意的,那運(yùn)行過(guò)程根本無(wú)法控制,而我們需要的是數(shù)據(jù),而非源碼!
　　要想控制這些源碼,獲得腳本運(yùn)行的控制權(quán),把源碼轉(zhuǎn)換成我們需要的數(shù)據(jù),就得有個(gè)約定.

　　4. 普遍的相關(guān)約定
　　既然瀏覽器一定會(huì)自動(dòng)執(zhí)行返回的腳本這個(gè)客觀事實(shí)改變不了,我們可以在返回的文本上做點(diǎn)處理,和服務(wù)器端作個(gè)約定,把個(gè)已在存在的回調(diào)函數(shù)寫(xiě)在外面,再把數(shù)據(jù)當(dāng)作參數(shù)傳遞,當(dāng)瀏覽器運(yùn)行返回源碼的時(shí)候,將調(diào)用這個(gè)回調(diào)函數(shù),這樣,控制權(quán)又從瀏覽器傳回到我們的手中,數(shù)據(jù)即參數(shù),也有了,可以為所欲為.
　　這過(guò)程中回調(diào)函數(shù)的名稱是要確定的,通常是在發(fā)起前把回調(diào)函數(shù)名稱以提交參數(shù)的形式寫(xiě)在URL中,服務(wù)器再?gòu)奶峤粎?shù)中把這回調(diào)函數(shù)名稱輸出到客戶端.

　　如,存在一個(gè)全局回調(diào)函數(shù) function jsonp_callback(data){ alert(data.a); }

　　發(fā)起時(shí) : jsonp.connect(‘http://www.example.com/getdata.php?callback=jsonp_callback’);

　　//
　　在服務(wù)器端發(fā)現(xiàn)這個(gè)callback參數(shù)值為jsonp_callback,將輸出類似的文本

　　jsonp_callback( /**數(shù)據(jù)*/{a:’b'} );

　　瀏覽器端請(qǐng)求返回后將立即運(yùn)行 jsonp_callback( /**數(shù)據(jù)*/{a:’b'} );

it知識(shí)庫(kù)：JSONP的應(yīng)用，轉(zhuǎn)載需保留來(lái)源！

鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。