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