| t;， socialtestdb.json 是我们示例中的 JSON 数据文件，用来保存 People 数据。在 SocialTestJsonPersonService 的实现中，db.getJSONArray(PEOPLE_TABLE) 就是从该 JSON 文件获取所有的 People 数据。
在下一节，我们给出客户端实现，来消费 socialtestdb.json 中的 Social 数据。
Gadget/Restful 客户端实现
Gadget 实现
清单 3. SocialAppTest.xml
<?xml version="1.0" encoding="UTF-8"?>
<Module>
<ModulePrefs
title="Social Application Test"
author_email="lisanh@cn.ibm.com">
<Require feature="osapi" />
<Require feature="dynamic-height" />
</ModulePrefs>
<Content type="html" ><![CDATA[<!-- Fetching People and Friends -- >
<div>
<button onclick=''fetchPeople();''>Fetch people and friends</button>
<div>
<span id=''viewer''></span>
<ul id=''friends''></ul>
</div>
</div>
<script type=''text/javascript''>
var allPeople;
function render(data) {
var viewer = data.viewer;
allPeople = data.viewerFriends.list;
document.getElementById(''viewer'').innerHTML = viewer.id;
document.getElementById(''friends'').innerHTML = '''';
for (var i = 0; i < allPeople.length; i++) {
document.getElementById(''friends'').innerHTML += ''<li>'' +
allPeople[i].name.formatted + ''</li>'';
}
gadgets.window.adjustHeight();
}
function fetchPeople() {
var fields = [''id'',''age'',''name'',''gender'',''profileUrl'',''thumbnailUrl''];
var batch = osapi.newBatch();
batch.add(''viewer'', osapi.people.getViewer({sortBy:''name'',fields:fields}));
batch.add(''viewerFriends'',
osapi.people.getViewerFriends({sortBy:''name'',fields:fields}));
batch.add(''viewerData'', osapi.appdata.get({keys:[''count'']}));
batch.add(''viewerFriendData'',
osapi.appdata.get({groupId:''@friends'',keys:[''count'']}));
batch.execute(render);
}
</script>]]></Content>
</Module>
Eclipse环境下的OpenSocial开发(5)
时间:2011-10-22 IBM 李三红
如清单 3 所示，fetchPeople 使用了 osapi 获得 OpenSocial 数据，并把它们展示在 HTML 页面上 。osapi 是一个轻量级的 JavaScript 类库，用于帮助客户端获得 OpenSocial 数据。显示该 Gadget 的 HTML 页面代码 (socialtest.html)，请读者详见文章后面的资源类表，在这里我们就不一一列出。
现在，我们可以在 Eclipse IDE 中启动 Shindig， 在你的浏览器里输入地址：
http://localhost:8080/gadgets/files/samplecontainer/socialtest.html，打开 SocialAppTest Gadget，点击”Fetch people and friends”按钮，SocialAppTest Gadget 向本地 Shindig 请求数据， Shindig 从 socialtestdb.json JSON 文件中获取数据，返回给 Gadget, 并在浏览器中显示，如图 4 所 示：
图 4. SocialAppTest Gadg |
