JSONP之我見

更新時(shí)間：2015年03月24日 08:55:54 投稿：hebedich

本文主要向大家介紹了個人對于jsonp的理解，jsonp的概念，跨域問題，以及jsonp與XMLHttpRequest的區(qū)別，由于本人也是javascript的初學(xué)者，難免會有些不當(dāng)之處，還請指正，謝謝。

JavaScript初學(xué)，一點(diǎn)自己的理解，有不當(dāng)之處請大家指正~

JSONP：

本地html文件要獲取xxx網(wǎng)站（跨域）數(shù)據(jù)時(shí)使用的方法。

跨域問題：

外部服務(wù)器的數(shù)據(jù)只能用外部服務(wù)器中的js訪問，本地js無法用XMLHttpRequest()訪問。

外部服務(wù)器中的Web服務(wù)提供JSON數(shù)據(jù)，比如在http://gumball.wickedlysmart.com/中，數(shù)據(jù)包含在函數(shù)updateSales中作為參數(shù)，現(xiàn)在要在本地html中訪問外部服務(wù)器中的JSON數(shù)據(jù)該怎么辦呢？

1，查看Web服務(wù)文檔，明確服務(wù)實(shí)際使用的參數(shù)名（本例只有一個參數(shù)即一個對象數(shù)組）；
2，在url中指定一個回調(diào)函數(shù)，http://gumball.wickedlysmart.com/?callback=updateSales，用來指定Web服務(wù)中訪問JSON數(shù)據(jù)的函數(shù)名；
3，在本地js文件中使用剛才定義的函數(shù)名創(chuàng)建函數(shù)updateSales(對象),編寫處理得到外部JSON數(shù)據(jù)的方法；
4，在html文件中的<body>標(biāo)簽下使用<script>標(biāo)簽鏈接到外部Web服務(wù)，url為2中的那個路徑。

總結(jié)：

JSONP目的在于提供給本地html一個函數(shù)接口（本地html可通過在url后方加入？callback=functionName的方法指定函數(shù)名），為了確保數(shù)據(jù)訪問的安全，服務(wù)器將安全的數(shù)據(jù)放在回調(diào)函數(shù)的參數(shù)中，函數(shù)內(nèi)部的參數(shù)就是服務(wù)器提供給本地的數(shù)據(jù)，至于怎么使用這些數(shù)據(jù)就要在本地的js中定義這個callback函數(shù)了。

注意：本地使用JSONP請求訪問Web服務(wù)，可能會獲取不安全的Js代碼，所以要確保信任這個Web服務(wù)。

JSONP與XMLHttpRequest：

XMLHttpRequest用于開發(fā)內(nèi)部Web服務(wù)，內(nèi)部訪問內(nèi)部，同域訪問會更加簡便。

訪問外部數(shù)據(jù)時(shí)（跨域訪問）就要使用JSONP。

以上所述就是本文的全部內(nèi)容了，希望大家能夠喜歡，能夠?qū)Υ蠹覍W(xué)習(xí)jsonp有所幫助。

您可能感興趣的文章: