当前的社交游戏非常热门,Opensocial作为一种接入规范,其交互大致如下。

1.与平台交互:
opensocial是通过两个方法来实现的:
一、请求:request()
CODE:
function request ( ) {
  var idspec = opensocial. newIdSpec ( { "userId" : "OWNER", "groupId" : "FRIENDS" } );
  var req = opensocial. newDataRequest ( );
  req. add (req. newFetchPersonRequest ( "OWNER" ), "get_owner" );
  req. add (req. newFetchPeopleRequest (idspec ), "get_friends" );
  req. send (response );
};

接下来,我们将详细介绍 request 函数,它可调用 OpenSocial 以获得所有者及好友。该函数可执行以下操作:
* 通过调用 newIdSpec() 创建 idspec。
* 通过调用 opensocial.newDataRequest() 创建请求(赋值在 req 变量中)。
* 调用 req.add() 以将 newFetchPersonRequest() 和 newFetchPeopleRequest() 函数添加到请求。(这两个函数只需要知道他们使用来获取用户信息的就行了。具体以后会详细介绍)。另外,add的第二个参数定义了一个方法 名:get_ownter和get_friends。这个名字是你自己定义的,在后面的response中获取数据的时候需要用到。
* 调用 req.send() 以启动请求,将 response 作为回调函数传递。
在使用 newFetchPeopleRequest 函数时,您会创建 IdSpec 对象并将其作为函数参数传递。您使用的 IdSpec 会根据您需要检索的数据而异。下面显示了如何为各种请求创建 IdSpec 对象。
CODE:
// VIEWER_FRIENDS:
var idspec = opensocial. newIdSpec ( { "userId" : "VIEWER", "groupId" : "FRIENDS" } );
// OWNER_FRIENDS :
var idspec = opensocial. newIdSpec ( { "userId" : "OWNER", "groupId" : "FRIENDS" } );
注意:您可以使用作为 JavaScript 枚举(代表 OpenSocial 字段和方法)的缩写的字符串文字。例如,在req.newFetchPersonRequest("OWNER")中,不用编写
CODE:
opensocial. IdSpec. PersonId. OWNER
您只需编写
CODE:
"OWNER"
就行了
2、返回:response()
CODE:
function response (dataResponse ) {
  var owner = dataResponse. get ( 'get_owner' ). getData ( );
  var friends = dataResponse. get ( 'get_friends' ). getData ( );
  var html = 'Friends of ' + owner. getDisplayName ( );
  html += ':<br><ul>';
  friends. each (function (person ) {
      html += '<li>' + person. getDisplayName ( ) + '</li>';
  } );
  html += '</ul>';
};
服务器调用 response() 以处理数据 -- 所有者和所有者的好友,如下所示:
* 创建所有者和好友变量,并调用 dataResponse.get() 来使用服务器返回的值初始化这些变量。其中的参数get_owner和get_friends就是前面定义的。
* 通过 owner.getDisplayName()来取得所有者的姓名。
* 通过使用 each() 函数来循环查看好友集合。
* 对每个好友调用 getDisplayName() 以将好友的姓名添加到 HTML 输出。
* 调用 person.getDisplayName() 以循环查看每个好友并且将好友的姓名添加到 HTML。

2.与服务器后端交互

opensocial提供了通过ajax与后端程序交互的方法:gadgets.io.makeRequest
CODE:
<?xml version= "1.0" encoding= "UTF-8" ?>
<Module>
 <ModulePrefs title= "Standard gadget structure">
    <Require feature= "opensocial-0.8" />
</ModulePrefs>
 
 <Content type= "html">
 <! [CDATA [
    <script>
       function $ (id ) {
          return document. getElementById (id );
        }
       
       function request ( ) {
          ts = new Date ( ). getTime ( ); // 防止缓存
            var params = { };
            params [gadgets. io. RequestParameters. CONTENT_TYPE ] = gadgets. io. ContentType. TEXT; // 定义数据以text方式返回
            params [gadgets. io. RequestParameters. AUTHORIZATION ] = gadgets. io. AuthorizationType. SIGNED; // 定义使用加密的方式传输数据
          gadgets. io. makeRequest ( 'http://apps.guiwan.net/apps/test/index.php?hash=' + ts, response, params ); // 开始发送请求
        }
 
       function response (data ) {
          var main = $ ( 'main' );
          main. innerHTML = data. text; // data.text就是返回的数据
        }
       request ( );
    </script>
    
    <div id= 'main'></div>
  ] ]>
 </Content>
</Module>

以上就是一个最简单的交互方法了
如果需要用post方式传递数据,那么则添加以下几行:
CODE:
var postdata = {mod: 'comment',action: 'post' };
    params [gadgets. io. RequestParameters. METHOD ] = gadgets. io. MethodType. POST;
    params [gadgets. io. RequestParameters. POST_DATA ] = gadgets. io. encodeValues (postdata );
实例:
CODE:
// 向服务器端发起请求
function go (postData ) {
    ts = new Date ( ). getTime ( );
    var params = { };
    params [gadgets. io. RequestParameters. CONTENT_TYPE ] = gadgets. io. ContentType. TEXT;
    params [gadgets. io. RequestParameters. AUTHORIZATION ] = gadgets. io. AuthorizationType. SIGNED;
   
    if (postData ) {
        params [gadgets. io. RequestParameters. METHOD ] = gadgets. io. MethodType. POST;
        params [gadgets. io. RequestParameters. POST_DATA ] = gadgets. io. encodeValues (postData );
    }
    gadgets. io. makeRequest ( 'http://apps.guiwan.net/apps/?hash=' + ts, showIndex, params );
}
function showIndex (data ) {
    var main = $ ( 'body' );
    main. innerHTML = data. text;
}
var postData = {name:$ ( 'name' ). value, age:$ ( 'age' ). value }
go (postData )