JSONP需要完成的任務(wù)包括兩個(gè)方面:
?獲取第三方服務(wù)器上的數(shù)據(jù)朗恳;
?通過本地的JS代碼對(duì)第三方的數(shù)據(jù)進(jìn)行處理和渲染
瀏覽器雖然限制了Ajax的跨域通信得糜,但允許在頁面中插入動(dòng)態(tài)的腳本元素。
所以可以通過第三方服務(wù)器生成動(dòng)態(tài)的js代碼來回調(diào)本地的js方法繁扎,而方法中的參數(shù)則由第三方服務(wù)器在后臺(tái)獲取幔荒,并以JSON的形式填充到JS方法當(dāng)中,這也就是“JSON with Padding”中“padding”的真正意義梳玫。
應(yīng)用過程當(dāng)中爹梁,請(qǐng)求方(本地)向第三方服務(wù)器請(qǐng)求動(dòng)態(tài)JS腳本,并將獲取數(shù)據(jù)后需要回調(diào)的函數(shù)名以約定好的參數(shù)名(如callback等)發(fā)送給第三方服務(wù)器提澎。
第三方服務(wù)器需要為JSONP請(qǐng)求開發(fā)相應(yīng)的API姚垃,API中先獲取JSONP請(qǐng)求需要的數(shù)據(jù),然后以JSON的形式封裝盼忌,再與請(qǐng)求方的回調(diào)函數(shù)名拼接在一起积糯,動(dòng)態(tài)生成請(qǐng)求方需要調(diào)用的JS代碼。
要自己書寫一個(gè)jsonp的方法谦纱,是要實(shí)現(xiàn)以下幾個(gè)模塊:
生成script標(biāo)簽
注冊(cè)callback函數(shù)
返回一個(gè)Promise
移除script標(biāo)簽
移除callback函數(shù)