JsonP / Google AJAX Libraries API / Mashup

最近经常上豆瓣,也关注了一下他们最近推出的API服务,据说淘宝也将开放API,google更是不用说,开始为众多的ajax库提供服务器端分发服务。越来越多的网站开始提供API服务,也表示有越来越多的Mashup可能性,抛砖引玉,希望越来越多的开发者加入到这个领域。

一、JsonP + API:Javascrpt中跨域调用数据

先了解下JsonP(JSON with Padding):
利用script标签,通过特定的src地址的调用,来执行一个客户端的js函数,在服务器端生成相对的数据(json格式)并以参数的形式传递给这个客户端的js函数并执行这个函数,前提是需要服务器端的数据输出支持

以delicious的API提供的jsonp支持为例。

1. 我们先在客户端写一个带参数的函数doyourwork以便处理返回的数据:
    <script type="text/javascript">
    <!--
    function doyourwork(data){
    alert(data);
      //处理数据代码....
    }
    //-->
    </script>


2. 通过script标签,调用http://feeds.delicious.com/feeds/json/bob?callback=doyourwork 生成数据并作为参数传入doyourwork来执行函数
<script type="text/javascript" src="http://feeds.delicious.com/feeds/json/bob?callback=doyourwork"></script>
这一行相当于执行以下javascript代码:
 doyourwork(服务器端生成的数据--- 以服务器端生成的数据为参数执行js函数doyourwork


当然,现在很多的js库都已经有相应的支持,用起来很方便,比如在jquery中,可以这样
$.getJSON("http://feeds.delicious.com/feeds/json/bob?callback=", function(data){
    alert(data); 
    //处理数据代码....
});

更具体的东西请我google code上的例子。

参考 remote json jsonp


二、Google AJAX Libraries API for Mashup!

Google的Dion Almaer也开始在ajaxian.com上推广AJAX Libraries API:其实就是把各种AJAX库放在google的服务器上,为开发者提供更快更好的调用服务

目前已经提供的AJAX库包括:jQuery / prototype / script_aculo_us / MooTools / dojo

调用方式一
<script src="http://www.google.com/jsapi"></script>
<script>
// 加载 jQuery; 版本:可以选1,会自动加载1的最新版本1.2.6;压缩(可选):参数uncompressed
google.load("jquery", "1.2.6", {uncompressed:true});

// 页面加载完成后执行下面程序
google.setOnLoadCallback(function() {
    $("<p>jQuery load completed</p>").appendTo("body");
});
</script>


调用方式二

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.js"></script>
<script>
    $("<p>jQuery load completed</p>").appendTo("body");
</script>

转载于:https://www.cnblogs.com/ruishuang208/p/3819469.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值