JSONP

JSONP包括IE6在內(nèi)的大多瀏覽器支持的標(biāo)準(zhǔn)跨域數(shù)據(jù)訪問方式。核心思想是利用JS標(biāo)簽里面的跨域特性進(jìn)行跨域數(shù)據(jù)訪問，在JS標(biāo)簽里面存在的是一個跨域的URL，實際執(zhí)行的時候通過這個URL獲得一段字符串，這段返回的字符串必須是一個合法的JS調(diào)用，通過EVAL這個字符串來完成對獲得的數(shù)據(jù)的處理。

目錄

• 1 JSONP實現(xiàn)
• 2 服務(wù)器端實現(xiàn)對JSON支持
• 3 JSONP在JQuery中的體現(xiàn)
• 4 相關(guān)條目
• 5 參考來源

JSONP實現(xiàn)

• 大多JS框架都支持一個包裝后的JSONP實現(xiàn)。

例如EXTJS：

在URL里面指定跨域的目標(biāo)地址，在PARAMS里面指定傳遞過去的參數(shù)，這些都和AJAX的實現(xiàn)一樣。

• 不一樣的地方如下：

實際傳遞的時候，EXT框架會自動添加一個叫做callback的參數(shù)，這個參數(shù)每次調(diào)用都不一樣，不用管他。

在后臺處理的時候，獲得這個callback的參數(shù)，直接把它當(dāng)做一個js函數(shù)調(diào)用的名字，加上括號，和你自己希望提供的字符串，組合起來就是一個合法的js方法調(diào)用，在ext框架里面，這個方法調(diào)用的是success方法 .

服務(wù)器端實現(xiàn)對JSON支持

• 這僅僅需要把服務(wù)的JSON數(shù)據(jù)轉(zhuǎn)換成想要的script tags的形式就可以了，格式可以自已定義，畢竟這是個非官方的協(xié)議。
• 可參考：Implement JSONP in your Asp.net Application
• 注：Callback僅僅是JSONP的簡單實現(xiàn)，可以根據(jù)具體需要實現(xiàn)更復(fù)雜的功能，比如可以在客戶端動態(tài)集成更多的變量數(shù)據(jù)來完成分頁功能。

JSONP在JQuery中的體現(xiàn)

1. $.getJSON

　　<script>
　　$(document).ready(function(){
　　$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?
       tags=cat&tagmode=any&format=json&jsoncallback=?",
　　function(data){
　　$.each(data.items, function(i,item){
　　$("<img/>").attr("src", item.media.m).appendTo("#images");
　　if ( i == 3 ) return false;
　　});
　　});
　　});
　　</script>
　　jsoncallback=?，其中？會自動替換為function(data)函數(shù)。

2. $.ajax

　　$.ajax({
　　dataType: 'jsonp',
　　data: 'id=10',
　　jsonp: 'jsonp_callback',
　　url: 'http://www.yiwuku.com/getdata',
　　success: function () {
　　// do stuff
　　},
　　});

相關(guān)條目

• JSON
• CSRF
• CSS
• DTD
• FORM
• HTML
• HTML5

參考來源

• http://baike.baidu.com/view/2131174.htm