1. 程式人生 > >ajax與jsonp的區別及用法

ajax與jsonp的區別及用法

首先我們應該知道ajax和jsonp可以與後臺通訊,獲取資料和資訊,但是又不用重新整理整個頁面,實現頁面的區域性重新整理。
接下來我們就來看一下ajax和jsonp的區別。

ajax和jsonp的區別:
ajax是一種傳送http請求與後臺進行非同步通訊的技術。其原理是例項化xmlhttp物件,使用此物件與後臺通訊。
一個完整的AJAX請求一般包括以下步驟:
(1)例項化XMLHttpRequest物件
(2)連線伺服器
(3)傳送請求
(4)接收響應資料

jsonp是一種可以實現跨域傳送http請求的資料通訊格式,可以嵌在ajax中使用。其原理是利用script標籤可以跨域連結資源的特性。

JSONP由兩部分組成:回撥函式和資料,回撥函式一般是在瀏覽器控制,作為引數發往伺服器端(當然,你也可以固定回撥函式的名字,但客戶端和伺服器端的名稱一定要一致)。當伺服器響應時,伺服器端就會把該函式和資料拼成字串返回。
JSONP的請求過程如下:
請求階段:瀏覽器建立一個 script 標籤,並給其src 賦值。
傳送請求:當給script的src賦值時,瀏覽器就會發起一個請求。
資料響應:服務端將要返回的資料作為引數和函式名稱拼接在一起(格式類似”jsonpCallback({name: ‘abc’})”)返回。當瀏覽器接收到了響應資料,由於發起請求的是 script,所以相當於直接呼叫 jsonpCallback 方法,並且傳入了一個引數。
最後:jsonp只支援get請求,ajax支援get和post請求。

本次給大家推薦一個免費的學習群,裡面概括移動應用網站開發,css,html,webpack,vue node angular以及面試資源等。
對web開發技術感興趣的同學,歡迎加入Q群:864305860,不管你是小白還是大牛我都歡迎,還有大牛整理的一套高效率學習路線和教程與您免費分享,同時每天更新視訊資料。
最後,祝大家早日學有所成,拿到滿意offer,快速升職加薪,走上人生巔峰。