今天在開發聯調的過程中,需要跨域的獲取數據,因為使用的jquery,當然使用dataType:'jsonp'就能夠很easy的解決了。
但因為當時後端沒有支援jsonp來訪問,後來他在實現這個功能的時候問了我一句,jsonp形式返回的格式是怎麼樣子的?我一直以來只知道怎麼使用,迷迷糊糊的卻沒有答上來。 。 。
雖然後來解決了,但是對於喜歡解決問題的我,心裡卻一直耿耿於懷,必須得把這個研究透徹了,於是我開始翻閱資料,看到後面真有種豁然開朗的感覺,於是打算做個筆記與大家分享。
JSON和JSONP的差別
JSON和JSONP雖然只有一個字母的差別,但其實他們根本不是一回事兒:JSON是一種資料交換格式,而JSONP是一種跨域資料交互的協議,使用JSONP方法獲取到的仍然是json格式的資料。
說穿了,用JSON来传数据,靠JSONP来跨域
。
JSONP詳細闡述
我們都知道,一个页面的ajax只能获取和此页面同域的数据。
,所以當我們需要跨域取得資料的時候就需要使用到JSONP方法來取得了。
如下圖所示,就是使用json格式取得跨域資料回傳的錯誤提示:
那該如何解決呢?使用框架的前端童鞋們可能都有自己相應的辦法,例如jquery就是把dataType设为jsonp
就能解決了,但是我們在使用的時候有沒有想過,為什麼這樣就能解決呢?中心思想又是什麼呢?
下面就開始為大家詳細闡述,首要想法就是利用scirpt標籤來引入跨域的資料。我們從最開始慢慢深入jsonp的過程。
引導步驟1
寫b.com/b.js
內容:
alert(‘hello');a.com/a.html
複製程式碼 程式碼如下: