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 請求同樣工做。）