說說jsonp

什麼是jsonp

jsonp充其量只能說是一種「方法」。它可讓頁面從其餘域中獲取資料。

 

首先要知道的是同源策略，在javascript中使用http請求（ajax）是會受到同源策略的限制的。A網站的頁面是不能在javascript中訪問B網站的資源的。可是，對於這種但願A網站訪問B網站的資源的需求怎麼辦呢？（跨域訪問）。jsonp就出現了。

 

html中雖說javascript是不能跨域的，可是有許多標籤，好比<img>,<iframe>，<script>這些有src屬性的標籤是不受同源策略的影響的。因而jsonp就把腦筋動到script標籤上了。通常script都是靜態的，可是script可否是動態的呢？

 

好比我在script的src中的url帶上用戶id，這樣來訪問一個跨域的請求，請求返回這個用戶的我的信息，我再使用這個我的信息來渲染個人頁面。這樣不就能夠完成了一個跨域請求了。可是呢？script中返回的必須是javascript，因此呢，通常就約定，src中的url除了要帶動態請求所須要的信息之外，還須要帶一個回調信息（通常是一個回調函數），讓請求返回的數據是一個可執行的javascript的完整語句。

 

好比：

function handle_data(data) {
   // `data` is now the object representation of the JSON data
}


---
http://some.tld/web/service?callback=handle_data:
---
handle_data({"data_1": "hello world", "data_2": ["the","sun","is","shining"]});

再問個常常問到的問題，jsonp和ajax，json有什麼關係呢？

首先jsonp和ajax徹底是兩個概念，能夠說jsonp出現的理由就是彌補ajax沒法跨域訪問的缺陷而出現的。因此這兩個概念沒啥關係。至於有些框架，好比jquery喜歡把ajax和jsonp放在一塊兒，徹底是因爲他們的調用和使用方式很相像而已。

 

jsonp返回的數據並非json，而是javascrip，好比上例中的handle_date中返回的數據必定要是json麼？歷來沒人這麼說過。再次吐槽下，特別是前端的這些概念的名詞確實起的很容易讓人迷糊。

jsonp有什麼優勢呢？

第一個優勢固然是能跨域了。一個訪問再也不受限於域名了，這個表明什麼呢？表明我能夠提供一個公共的webservice了，這個服務能夠給你服務，也能夠給他服務，大家不須要必定是在個人域名下的。

 

其次的優勢是將回調方法的權限給了調用方。這個就至關於將controller層和view層終於分開了。我提供的jsonp服務只提供純服務的數據，至於提供服務之後的頁面渲染和後續view操做都由調用者來本身定義就行了。若是有兩個頁面須要渲染同一份數據，大家只須要有不一樣的渲染邏輯就能夠了，邏輯均可以使用同一個jsonp服務。

 

還有一個優勢是它甚至不須要瀏覽器能支持XMLHTTPRequest，就是說全部的瀏覽器均可以使用這個技術。

json有什麼缺點呢？

首先的缺點是安全性。萬一假如提供jsonp的服務存在頁面注入漏洞，即它返回的javascript的內容被人控制的。那麼結果是什麼？全部調用這個jsonp的網站都會存在漏洞。因而沒法把危險控制在一個域名下…因此在使用jsonp的時候必需要保證使用的jsonp服務必須是安全可信的。

 

其次是錯誤處理，jsonp在調用失敗的時候不會返回各類HTTP狀態碼。只有200，沒有404，沒有500等狀態碼讓你來標識是否要從新調用。

 

它只能支持GET，而不能支持POST請求，因此它的參數必定是帶在HTTP頭中的，會受到一些參數的限制，好比長度限制。

參考文章

http://blog.csdn.net/liaomin416100569/article/details/5480825

http://jingyan.baidu.com/article/eb9f7b6dbd3ff0869364e81c.html

http://www.json-p.org/

http://www.cnblogs.com/dowinning/archive/2012/04/19/json-jsonp-jquery.html