對於jsonp做一個筆記，來源於 https://blog.csdn.net/hansexploration/article/details/80314948
Ajax 只支持同源，直接請求普通文件存在跨域無權限訪問的問題。 而當在Web頁面上調用js文件時不受跨域的影響，因此如果想通過純web跨域訪問數據可以通過在遠程服務器上設法把數據裝進js格式的文件中的方式，供客戶端調用和進一步處理。
而json的純字符數據格式可以簡潔的描述復雜數據，更妙的是JSON還被js原生支持，所以在客戶端幾乎可以隨心所欲的處理這種格式的數據。
這樣子解決方案就呼之欲出了，web客戶端通過與調用腳本一模一樣的方式，來調用跨域服務器上動態生成的js格式文件（一般以JSON為后綴），顯而易見，服務器之所以要動態生成JSON文件，目的就在於把客戶端需要的數據裝入進去。
為了便於客戶端使用數據，逐漸形成了一種非正式傳輸協議，人們把它稱作JSONP，該協議的一個要點就是允許用戶傳遞一個callback參數給服務端，然后服務端返回數據時會將這個callback參數作為函數名來包裹住JSON數據，這樣客戶端就可以隨意定制自己的函數來自動處理返回數據了.
只要服務端提供的js腳本是動態生成的就行，這樣調用者可以傳一個參數過去告訴服務端 “我想要一段調用XXX函數的js代碼，請你返回給我”，於是服務器就可以按照客戶端的需求來生成js腳本並響應了。
客戶端請求代碼
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
不再直接把遠程js文件寫死，而是編碼實現動態查詢，而這也正是jsonp客戶端實現的核心部分，本例中的重點也就在於如何完成jsonp調用的全過程。
我們看到調用的url中傳遞了一個code參數，告訴服務器我要查的是CA1998次航班的信息，而callback參數則告訴服務器，我的本地回調函數叫做flightHandler，所以請把查詢結果傳入這個函數中進行調用。
最后是使用jQuery實現jsonp(代碼封裝，以便與用戶界面交互，從而實現多次重復調用)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 3 <html xmlns="http://www.w3.org/1999/xhtml" > 4 5 <head> 6 7 <title>Untitled Page</title> 8 9 <script type="text/javascript" src=jquery.min.js"></script> 10 11 <script type="text/javascript"> 12 13 jQuery(document).ready(function(){ 14 15 $.ajax({ 16 17 type: "get", 18 19 async: false, 20 21 url: "http://flightQuery.com/jsonp/flightResult.aspx?code=CA1998", 22 23 dataType: "jsonp", 24 25 jsonp: "callback",//傳遞給請求處理程序或頁面的，用以獲得jsonp回調函數名的參數名(一般默認為:callback) 26 27 jsonpCallback:"flightHandler",//自定義的jsonp回調函數名稱，默認為jQuery自動生成的隨機函數名，也可以寫"?"，jQuery會自動為你處理數據 28 29 success: function(json){ 30 31 alert('您查詢到航班信息：票價： ' + json.price + ' 元，余票： ' + json.tickets + ' 張。'); 32 33 }, 34 35 error: function(){ 36 37 alert('fail'); 38 39 } 40 41 }); 42 43 }); 44 45 </script> 46 47 </head> 48 49 <body> 50 51 </body> 52 53 </html>
是不是有點奇怪？為什么我這次沒有寫flightHandler這個函數呢？而且竟然也運行成功了！
這就是jQuery的功勞了，jquery在處理jsonp類型的ajax時（，雖然jquery也把jsonp歸入了ajax，但其實它們真的不是一回事兒），自動幫你生成回調函數並把數據取出來供success屬性方法來調用，是不是很爽呀？
補充
這里針對ajax與jsonp的異同再做一些補充說明：
1、ajax和jsonp這兩種技術在調用方式上”看起來”很像，目的也一樣，都是請求一個url，然后把服務器返回的數據進行處理，因此jquery和ext等框架都把jsonp作為ajax的一種形式進行了封裝。
2、但ajax和jsonp其實本質上是不同的東西。ajax的核心是通過XmlHttpRequest獲取非本頁內容，而jsonp的核心則是動態添加。