OpenSocialist: mixiアプリで "Hello, [ユーザ名]!" (2)

前回の続き。

function init() {
  var req = opensocial.newDataRequest();
  req.add(req.newFetchPersonRequest(opensocial.IdSpec.PersonId.VIEWER), "viewer");
  req.send(function(data) {
    var viewer = data.get("viewer").getData();
    var name = viewer.getDisplayName();
    document.getElementById("target").innerHTML = name;
  });
}
gadgets.util.registerOnLoadHandler(init);

の中身を見てみよう。これは何をしているかというと、最後の

gadgets.util.registerOnLoadHandler(init);

というイベントハンドラで、アプリが読み込まれた後にinit()という関数を呼び出している。init()関数の中では、まず

var req = opensocial.newDataRequest();

で、DataRequestオブジェクトのreqを作成している。DataRequestオブジェクトは、mixiのサーバに対してデータ取得のリクエストを投げてくれるオブジェクトだ。ただ、これだけでは何にもリクエストしてくれないので、このreqに対して、個別のリクエストオブジェクトを追加する必要がある。

req.add(req.newFetchPersonRequest(opensocial.IdSpec.PersonId.VIEWER), "viewer");

それをしているのがこの部分で、reqのnewFetchPersonRequest()というメソッドを使って、プロフィール情報を取得するためのリクエストオブジェクトを作成し、それをadd()メソッドによって、DataRequestオブジェクトのreqに追加している。

newFetchPersonRequest()メソッドの引数には、プロフィールを取得したいユーザのIDを与える。ここで使っているopensocial.IdSpec.PersonId.VIEWERは、「このmixiアプリを開いているユーザのID」を表す。addメソッドの第2引数の"viewer"は、後でリクエストのレスポンスを識別するためのキー文字列なので、任意の文字列でOK。

次に、reqのsend()メソッド

req.send(function(data) {...});

によって、実際にリクエストをサーバに送信している。このリクエストは、Ajaxで非同期に行われる。send()メソッドの引数には、データ取得後に実行するコールバック関数を入れる。コールバック関数に渡されるdataは、DataResponseクラスのオブジェクト。

コールバック関数では、

var viewer = data.get("viewer").getData();

の部分で、DataResponseオブジェクトのdataから、リクエストの際に指定しておいた"viewer"というキー文字列を使ってブロフィール情報を取得している。get()メソッドの戻り値はResponseItemクラスのオブジェクトで、そこから更にgetData()することで、目的のオブジェクト（Personクラスのオブジェクト）が手に入る。

あとは、PersonオブジェクトのgetDisplayName()で、ユーザ名を取得し、それを使ってHTMLを更新すればOK。

参考URL:
mixi Developer Center