jquery 中jsonp的實現原理

　　在同源策略下，在某個服務器下的頁面是無法獲取到該服務器以外的數據的，即一般的 ajax 是不能進行跨域請求的。但 img 、 iframe 、 script 等標簽是個例外，這些標簽可以通過 src 屬性請求到其他服務器上的數據。利用 script 標簽的開放策略，我們可以實現跨域請求數據，當然這需要服務器端的配合。 Jquery 中 ajax 的核心是通過 XmlHttpRequest 獲取非本頁內容，而 jsonp 的核心則是動態添加 <script> 標簽來調用服務器提供的 js 腳本。

　　當我們正常地請求一個 JSON 數據的時候，服務端返回的是一串 JSON 類型的數據，而我們使用 JSONP 模式來請求數據的時候服務端返回的是一段可執行的 JavaScript 代碼。因為 jsonp 跨域的原理就是用的動態加載 script 的 src ，所以我們只能把參數通過 url 的方式傳遞 , 所以 jsonp 的 type 類型只能是 get ！

示例：

$.ajax({

    url: 'http://192.168.1.114/yii/demos/test.php', // 不同的域

    type: 'GET', // jsonp 模式只有 GET 是合法的

    data: {

        'action': 'aaron'

    },

    dataType: 'jsonp', // 數據類型

    jsonp: 'backfunc', // 指定回調函數名，與服務器端接收的一致，並回傳回來

})

其實 jquery 內部會轉化成

http://192.168.1.114/yii/demos/test.php?backfunc=jQuery2030038573939353227615_1402643146875&action=aaron

然后動態加載

<script type="text/javascript"src="http://192.168.1.114/yii/demos/test.php?backfunc= jQuery2030038573939353227615_1402643146875&action=aaron"></script>

然后后端就會執行 backfunc( 傳遞參數 ) ，把數據通過實參的形式發送出去。

　　使用 JSONP 模式來請求數據的整個流程：客戶端發送一個請求，規定一個可執行的函數名（這里就是 jQuery 做了封裝的處理，自動幫你生成回調函數並把數據取出來供 success 屬性方法來調用 , 而不是傳遞的一個回調句柄），服務器端接受了這個 backfunc 函數名，然后把數據通過實參的形式發送出去

 

（在 jquery 源碼中， jsonp 的實現方式是動態添加 <script> 標簽來調用服務器提供的 js 腳本。 jquery 會在 window 對象中加載一個全局的函數，當 <script> 代碼插入時函數執行，執行完畢后就 <script> 會被移除。同時 jquery 還對非跨域的請求進行了優化，如果這個請求是在同一個域名下那么他就會像正常的 Ajax 請求一樣工作。）