180 likes | 347 Views
Opensocial Flash/Flex 客户端开发包. 项目主页 http://code.google.com/p/opensocial-actionscript-client/. 使用 JS Code 获取朋友列表.
E N D
Opensocial Flash/Flex客户端开发包 项目主页 http://code.google.com/p/opensocial-actionscript-client/
使用JSCode获取朋友列表 function request(){var idspec = opensocial.newIdSpec({"userId":"OWNER","groupId":"FRIENDS"});var req = opensocial.newDataRequest(); req.add(req.newFetchPeopleRequest(idspec),"get_friends"); req.send(response);};function response(dataResponse){var friends = dataResponse.get('get_friends').getData();var html ='<ul>'; friends.each(function(person){ html +='<li>'+ person.getDisplayName()+'</li>';}); html +='</ul>'; document.getElementById('message').innerHTML = html;}; 1 2 发起请求 返回结果
使用AS3 Code获取朋友列表 2 privatefunction fetchFriends():void{var req:AsyncDataRequest=newAsyncDataRequest(Feature.PEOPLE_GET,newPeopleRequestOptions().setUserId("@me").setGroupId("@friends").setCount(5).setStartIndex(0)); req.addEventListener(ResponseItemEvent.COMPLETE, fetchFriendsEventHandler); req.send(client); people.removeAll();}privatefunction fetchFriendsEventHandler(event:ResponseItemEvent):void{var c:Collection=event.response.getData(); logger.info(c.toDebugString());var arr:Array= c.getArray();for(var i:int=0; i < arr.length; i++){var p:Person= arr[i]; logger.info(p.getDisplayName()); people.addItem(p);}if(c.getRemainingSize()>0){var req:AsyncDataRequest=event.target asAsyncDataRequest;(req.getOptions()asPeopleRequestOptions).setStartIndex(c.getNextOffset()); req.send(client);}} 1 发起请求 返回结果
开发指南 异步方式返回信息 // 初始化Clientvar client:JsWrapperClient=newJsWrapperClient();client.addEventListener(OpenSocialClientEvent.CLIENT_READY, onReady);client.start(); // 初始化完成后,开始进行数据交互function onReady(event:OpenSocialEvent):void{ // API类型1. 同步地获取OpenSocial运行环境信息var helper:SyncHelper=newSyncHelper(client);var domain:String= helper.getDomain();var view:String= helper.getCurrentView(); // API类型2. 异步地获取OpenSocial远程数据信息// 构造请求及参数var req:AsyncDataRequest=newAsyncDataRequest(// 请求类型Feature.PEOPLE_GET,// 构造参数newPeopleRequestOptions().setUserId("@me").setGroupId("@self"));// 注册事件处理句柄req.addEventListener(ResponseItemEvent.COMPLETE, fetchMeEventHandler);// 通过Client发送请求req.send(client);} // 数据获取事件处理句柄privatefunction fetchMeEventHandler(event:ResponseItemEvent):void{var person:Person=event.response.getData();// 显示该用户drawPerson(person);} 4 初始化 1 使用同步方式获取信息 2 使用异步方式获取信息 3
开发指南 –Container 私有API • 由于各Container可能会对Opensocial标准进行扩展,实现其自有的API。现阶段我们只实现了Myspace的Photo Service,我们会与Containers一起逐步完善。 var client:MyspaceJsWrapperClient=newMyspaceJsWrapperClient("opensocial.flash");client.addEventListener(OpenSocialClientEvent.CLIENT_READY,onReady);client.start();
开发指南 –Container 私有API // ----------------- Fetch Photos --------------------------privatefunction fetchPhotos():void{var req:AsyncDataRequest=newAsyncDataRequest(MyspaceFeature.PHOTOS_GET,newMyspacePhotosRequestOptions().setUserId("@me")); req.addEventListener(ResponseItemEvent.COMPLETE, fetchPhotosEventHandler); req.send(client); photos.removeAll();}privatefunction fetchPhotosEventHandler(event:ResponseItemEvent):void{var c:Collection=event.response.getData(); logger.info(c.toDebugString());var arr:Array= c.getArray();for(var i:int=0; i < arr.length; i++){var p:MyspacePhoto= arr[i]; photos.addItem(p);}if(c.getRemainingSize()>0){var req:AsyncDataRequest=event.target asAsyncDataRequest;(req.getOptions()asMyspacePhotosRequestOptions).setStartIndex(c.getNextOffset()); req.send(client);}} 发起获取图片的请求 1 返回结果 2
开发包整体结构 • 一个较完整的OpenSocial APIs stack,囊括了除批量发送外OpenSocial 0.81版本的所有编程接口(APIs)。 • 可以兼容现阶段的绝大多数Container,例如Renren.Com、51.Com、Myspace.com、Tianya.cn等。 • 一个完整的事件驱动开发模型。早期试用者们的反馈意见指出,相较于在JavaScript中被广泛使用的回调函数注册与触发机制而言,基于事件驱动的开发模型是ActionScript3下比较常见的开发方法 • 一个完整的基于FlexUnit的测试框架及对核心数据结构部分的测试用例,以方便开放源代码方式的协作开发 • 在库中有一个特殊的,也是非常重要的抽象类型OpenSocialClient,所有的OpenSocial请求都由这里发出。在目前这个版本中,我们定 义了它的一个参考实现JsWrapperClient——它寄生于OpenSocial容器环境下,通过调用外层的原生Javascript APIs完成功能。
开发包整体结构 – 扩展1 • 服务器端数据获取模式的扩展。 众所周知 OpenSocial规范支持多种数据获取模式,其中既包括了浏览器客户端的JavaScript模式,也包括了RESTful/RPC的服务器间交互模式。未来,规范还可能支持更多的社交类数据获取方法。通过继承并实现抽象化的数据获取渠道OpenSocialClient类,您可以自由添加所需要支持的数据获取方式。目前在库中我们已经包含了一个参考实现JsWrapperClient,并希望在不久的将来提供直接与服务器交互的参考实现 RestfulClient(名称待定)。这种抽象的好处是大大降低了您作为用户从一个Client转移到另一个Client上的成本——除了对于 Client初始化的少量修改外,您的后续处理代码可以无差别的继续沿用。这也将有助于浏览器端Flash和桌面AIR项目间共享功能性代码。
开发包整体结构 – 扩展2 • 不同OpenSocial容器间支持功能的扩展。 在不同的OpenSocial平台上,彼此的功能提供上可能会有些许的差别,如有的平台提供了用户视频的管理而另一些并没有。通过继承对应的JsWrapperClient或者是其他的Client,并改写Feature Book部分,您就可以根据容器的不同量体裁衣,在自由删补所需要功能的同时保持整体架构的稳定。
开发包整体结构 – 扩展3 • 不同OpenSocial容器间数据结构的扩展。 同样的功能在不同的OpenSocial平台上也可能由于数据存储结构的不同而有所差别,如有的平台 Person对象中包含了视频域而另一些则没有。对于JsWrapperClient,它会调用JS接口自动地发掘数据存储结构中的属性。我们也期望在其他类型的Client上也能以相应的技术来实现数据域的扩展自适应。
源码目录结构 • 源码下载地址: • http://opensocial-actionscript-client.googlecode.com/svn/trunk/ • 开发包的整体架构如下: • /doc: 从源代码通过AS-Doc生成的文档。 • /external: 开发中使用到的第三方库,包括as3corelib, flexunit, jsunit等等。 • /sample: 通过本开发包开发的范例应用。 • /src: 本开发包的源代码,具体内容将在下面介绍。 • /test: 单元测试,基于FlexUnit。
源码目录结构 • 开发包的源代码(/src)结构如下: • /base: 基础数据结构,包括People/Activity/Address等。 • /core: 核心类OpenSocialClient的基本定义和实现。OpenSocialClient的概念和在OpenSocial Java客户端开发包中client的概念非常接近。 • /features: 基于事件的异步请求处理机制。众所周知,AS3相对于AS2的一个重要改进就是从在JavaScript中被广泛使用的回调函数注册与触发机制,过渡到基于事件的异步请求处理机制。 • /jswrapper 和 /restful: 这两个目录分别包括了OpenSocialClient类的两个具体实现,即基于原生的JavaScript API的包装版本,和纯RESTful连接版本。请注意目前RESTful版本尚未实现。 • /ext:所有扩展将会在这个目录里实现,如Myspace。 • /util: 这里有为应用开发者和我们自己准备的趁手小工具,包括日志和打印功能等。