簡單梳理前端請求的變遷史,著重對JSONP進行整理
請求演變
- 使用form表單提交請求,缺點是每次提交必定會刷新頁面
- 在1基礎之上使用iframe進行局部刷新,用戶體驗得到一定優化
- 動態創建圖片提交請求
- 注意請求與返回內容類型須一致
- 每次必須返回圖片較為不便
- 動態創建script提交請求(即JSONP)
- 注意script必須在插入頁面后(可使用append方法)才會提交請求
- 為了不刷新頁面可依據后端數據庫變化情況同時對前端頁面內容進行同步更新
- script載入完成后可將其移除
- 提交請求時可直接講callback值傳入
JSONP定義:
-
請求方創建 script,src 指向響應方,同時傳一個查詢參數 ?callback=xxx
-
響應方根據查詢參數 callback,構造形如
xxx.call(undefined, '你要的數據')
xxx('你要的數據')
這樣的響應
-
瀏覽器接收到響應,就會執行
xxx.call(undefined, '你要的數據')
-
那么請求方就知道了他要的數據