Jsonp(
JSON with Padding)是资料格式 json 的一种“使用模式”,可以让网页从别的网域获取资料。
由于同源策略,一般来说位于 server1.example.com 的网页无法与不是 server1.example.com的服务器沟通,而 HTML 的<script> 元素是一个例外。利用 <script> 元素的这个开放策略,网页可以得到从其他来源动态产生的
JSON 资料,而这种使用模式就是所谓的 JSONP。用 JSONP 抓到的资料并不是 JSON,而是任意的JavaScript,用 JavaScript 直译器执行而不是用 JSON
解析器解析。
JSONP是一个非官方的
协议,它允许在服务器端集成Script tags返回至客户端,通过
javascript callback的形式实现跨域访问(这仅仅是JSONP简单的实现形式)。
JQuery下:
class="custom_num para-list list-paddingleft-1">
-
$.getJSON
1
2
3
4
5
6
7
8
9
10
11
monospace !important; border-top-left-radius: 0px !important; border-top-right-radius: 0px !important; border-bottom-right-radius: 0px !important; border-bottom-left-radius: 0px !important; border: 0px !important; float: none !important; height: auto !important; line-height: 1.3em !important; margin: 0px !important; overflow: visible !important; padding: 0px !important; vertical-align: baseline !important; width: auto !important; background: none !important;" class="js plain"><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;
????????????});
????????});
????});
jsoncallback=?,其中?会自动替换为function(data)函数。
?
2. $.ajax
1
2
3
4
5
6
7
8
9
$.ajax({
????dataType: 'jsonp',//数据类型为jsonp?
????data: 'id=10',
????jsonp: 'jsonp_callback',?//服务端用于接收callback调用的function名的参数
????url: 'http://www.yiwuku.com/getdata',
????success: function() {
????????
????},
});