7/80—
layout: JSONP 的工作原理
title: JSONP 的工作原理
date: 2017-11-15 21:06:47
根據(jù)瀏覽器同源策略,所謂同源就是協(xié)議、主機、端口號都相同時成為同源。a 域的js不能直接訪問 b域名的信息,但是script 標(biāo)簽的src屬性可以跨域引用文件,jsonp是請求之后后臺包裝好一段json,并且把數(shù)據(jù)放在一個callback函數(shù),返回一個js文件,動態(tài)引入這個文件,下載完成js之后,會去調(diào)用這個callback,通過這樣訪問數(shù)據(jù)。
2. JSONP有什么用由于同源從略的限制,XMLHttpRequest只允許請求前源(域名、協(xié)議、端口)的資源,為了實現(xiàn)跨域請求,可以通過script標(biāo)簽實現(xiàn)跨域請求,然后再服務(wù)端輸出JSON數(shù)據(jù)并執(zhí)行回調(diào)函數(shù),從而解決跨域數(shù)據(jù)請求
3. 如何使用JSONP HTML代碼PHP代碼
4. JSONP原理
首先在客戶端注冊一個callback,然后把callback的名字傳給服務(wù)器。此時,服務(wù)器先生成json數(shù)據(jù),然后以javascript語法的方式,生成function,function名字就是傳遞上來I帶參數(shù)jsonp。最后將json數(shù)據(jù)直接以入?yún)⒌姆绞?,放置function中,這樣就生成js語法的文檔,返回給客戶端。客戶端瀏覽器,解析script變遷,并執(zhí)行返回javascript文檔,此時數(shù)據(jù)作為參數(shù),傳入了客戶端預(yù)先定義好的callback函數(shù)里。
簡單的說,就是利用script標(biāo)簽沒有跨域限制的“漏洞”來達到與第三方通訊的目的。