亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

章節
問答
課簽
筆記
評論
占位
占位

jsonp的原理

 ajax 和 jsonp 區別如下: 

  • ajax 的核心是通過 XmlHttpRequest 獲取非本頁內容。
  • jsonp 的核心則是動態添加 <script> 標簽來調用服務器提供的 js 腳本,允許用戶傳遞一個 callback 參數給服務端,然后服務端返回數據時會將這個 callback 參數作為函數名來包裹住 JSON 數據,這樣客戶端就可以隨意定制自己的函數來自動處理返回數據了。

jquery、ext、dojo 這類庫的實現手段其實大同小異,在同源策略下,在某個服務器下的頁面是無法獲取到該服務器以外的數據的,但 img、iframe、script 等標簽是個例外,這些標簽可以通過 src 屬性請求到其他服務器上的數據。利用 script 標簽的開放策略,我們可以實現跨域請求數據,當然,也需要服務端的配合。一般的 ajax 是不能跨域請求的,因此需要使用一種特別的方式來實現跨域,其中的原理是利用 <script> 元素的這個開放策略。

這里有2個重要的參數:

jsonpCallback:
為 jsonp 請求指定一個回調函數名。這個值將用來取代 jQuery 自動生成的隨機函數名。這主要用來讓 jQuery 生成一個獨特的函數名,這樣管理請求更容易,也能方便地提供回調函數和錯誤處理。你也可以在想讓瀏覽器緩存 GET 請求的時候,指定這個回調函數名。從jQuery 1.5 開始,你也可以使用一個函數作為該參數設置,在這種情況下,該函數的返回值就是 jsonpCallback 的結果。

jsonp:
在一個 jsonp 請求中重寫回調函數的名字。這個值用來替代在 "callback=?" 這種 GET 或 POST 請求中 URL 參數里的 "callback" 部分,比如 {jsonp:'onJsonPLoad'} 會導致將 "onJsonPLoad=?" 傳給服務器。在 jQuery 1.5,設置 jsonp 選項為 false,阻止了 jQuery 從加入 "?callback" 字符串的 URL 或試圖使用 "=?" 轉換。在這種情況下,你也應該明確設置 jsonpCallback 設置。例如, { jsonp: false, jsonpCallback: "callbackName" }。

當我們正常地請求一個 JSON 數據的時候,服務端返回的是一串 JSON 類型的數據,而我們使用 JSONP 模式來請求數據的時候,服務端返回的是一段可執行的 JavaScript 代碼,所以我們可見服務器代碼最后一行。

$_GET['callback']).'('. json_encode(array('status'=>1,'info'=>'OK')) .')

就是執行的 backfunc 方法,然后把數據通過回調的方式傳遞過。

OK,就是整個流程就是:

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

右邊偽代碼模擬了下 jsonp 的原理。

 

任務

?不會了怎么辦
||

提問題

寫筆記

公開筆記
提交
||

請驗證,完成請求

由于請求次數過多,請先驗證,完成再次請求

加群二維碼

打開微信掃碼自動綁定

您還未綁定服務號

綁定后可得到

  • · 粉絲專屬優惠福利
  • · 大咖直播交流干貨
  • · 課程更新,問題答復提醒
  • · 賬號支付安全提醒

收藏課程后,能更快找到我哦~

使用 Ctrl+D 可將課程添加到書簽

邀請您關注公眾號
關注后,及時獲悉本課程動態

舉報

0/150
提交
取消
全部 精華 我要發布
全部 我要發布
最熱 最新
只看我的

手記推薦

更多

本次提問將花費2個積分

你的積分不足,無法發表

為什么扣積分?

本次提問將花費2個積分

繼續發表請點擊 "確定"

為什么扣積分?