JSONP原理

JSONP原理：

1. 首先在客戶端註冊一個callback, 而後把callback的名字傳給服務器。
2. 此時，服務器先生成 json 數據。
3. 而後以 javascript 語法的方式，生成一個function , function 名字就是傳遞上來的callback參數值 .
4. 最後將 json 數據直接以入參的方式，放置到 function 中，這樣就生成了一段 js 語法的文檔，返回給客戶端。
5. 客戶端瀏覽器，解析script標籤，並執行返回的 javascript 文檔，此時數據做爲參數，傳入到了客戶端預先定義好的 callback 函數裏.

jsonp 原理，代碼示意：

本地定義的函數===

<script>
    function local_func(data) {
        // 函數內容
    }
</script>

返回的數據放在srcipt標籤裏===

<script src="http://api.douban.com/v2/movie/in_theaters?callback=local_func"></script>
等價於：
<script>
    ;local_func([返回的數據])
</script>

jsonp的2種實現方式：

1.jsonp 在原生js中的實現:
經過src="http://api.douban.com/v2/movie/in_theaters?callback=local_func"。
直接輸入訪問：http://api.douban.com/v2/movi... ，返回的數據是一個對象：{xxx}。
直接輸入訪問：http://api.douban.com/v2/movi... ，返回的數據是一個對象：{xxx}。
直接輸入訪問：http://api.douban.com/v2/movi... ，返回的數據是：;local_func({xxx})。
注意點：
callback指定的回調函數，是客戶端註冊的，必須是定義在window下的全局函數。
例子網址：https://github.com/cag2050/js...

2.jsonp 在jquery ajax中的實現:
例子網址：https://github.com/cag2050/js...

• 代碼所在github倉庫：https://github.com/cag2050/js...