JSONP是什么

JSONP是什么？針對(duì)這個(gè)問(wèn)題，這篇文章給出了相對(duì)應(yīng)的分析和解答，希望能幫助更多想解決這個(gè)問(wèn)題的朋友找到更加簡(jiǎn)單易行的辦法。

JSONP

JSONP(JSON with Padding)是JSON的一種"使用模式"，可用于解決主流瀏覽器的跨域數(shù)據(jù)訪問(wèn)的問(wèn)題。由于同源策略，一般來(lái)說(shuō)位于 server1.example.com 的網(wǎng)頁(yè)無(wú)法與不是 server1.example.com的服務(wù)器溝通，而 HTML 的<script> 元素是一個(gè)例外。利用 <script> 元素的這個(gè)開(kāi)放策略，網(wǎng)頁(yè)可以得到從其他來(lái)源動(dòng)態(tài)產(chǎn)生的 JSON 資料，而這種使用模式就是所謂的 JSONP。用 JSONP 抓到的資料并不是 JSON，而是任意的JavaScript，用 JavaScript 直譯器執(zhí)行而不是用 JSON 解析器解析。

JSONP的由來(lái)

根據(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ù)。

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)求

JSONP原理

首先在客戶端注冊(cè)一個(gè)函數(shù)；然后把函數(shù)的名字傳給服務(wù)器；接著服務(wù)器成JSON數(shù)據(jù)，并以Javascript語(yǔ)法的方式，將數(shù)據(jù)傳入客戶端注冊(cè)的函數(shù)中；最后在客戶端注冊(cè)函數(shù)中接收J(rèn)SON即可。

JSONP的使用

1. 在客戶端調(diào)用提供JSONP支持的URL Service，獲取JSONP格式數(shù)據(jù)。

比如客戶想訪問(wèn)http://www.yiwuku.com/myService.aspx?jsonp=callbackFunction

假設(shè)客戶期望返回JSON數(shù)據(jù):["customername1","customername2"]

那么真正返回到客戶端的Script Tags: callbackFunction(["customername1","customername2"])

可能的調(diào)用方式:

2. 在客戶端寫(xiě)callbackFunction函數(shù)的實(shí)現(xiàn)

3. 頁(yè)面展示

4. 最終Page Code

關(guān)于JSONP的介紹就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，可以學(xué)到更多知識(shí)。如果覺(jué)得文章不錯(cuò)，可以把它分享出去讓更多的人看到。