MySpaceアプリケーションを作ろう

昨日、IDEA*IDEAの田口元氏が主催する「MySpace勉強会」に参加してきた。Web APIに興味を持つ開発者が10人程度で、それらに対し米国MySpace本社から来たBrian、Frank、Joshらがプレゼンしながら実際のコードを見せていくというスタイル。

意外だったのは、参加者の中でMySpaceアプリケーションの開発に手を出したことのある人が皆無だったこと。この類のイベントに来る人の中で0人なのだから、日本全体としても限りなく0に近いのではなかろうか。開発プラットフォームはまだほとんど宣伝もされず、利用者のフィードバックを少しずつ得ながら静かに広まっていく初期段階だという認識をMySpaceの人たちも持っているようだ。

今日は、その時に聞いてきた仕様や開発手順を基にして「はじめてのMySpaceアプリケーション」に挑戦してみた。"Hello, World"だけでは寂しいので利用者の性別と年齢を取り込みながら挨拶するようになっている。

↑開発者向けのサイトは http://developer.myspace.com/community/ だ。開発を行う人は最初に申請をしないといけない。名前やメールアドレス等を書き、submitすると返事が来るまで10分くらい待たされる。その間に「OpenSocialとは何ぞや」等の説明を適当に読みながら心の準備をしておく。

承認がおりたら http://developer.myspace.com/modules/apps/pages/myapps.aspx で"Create New App"ボタンを押す。

↑作るアプリケーションの名前やメールアドレス等を入れる。メールアドレスはアプリケーション毎にユニークでないといけない。これは昨日の勉強会で衝撃を受けたことなのだが、MySpaceのアプリケーションはユーザと同じように「人格」のようなものを持ち、開発者がそのアプリケーションの「最初の友人」になっているのだという。

↑XMLファイルをアップロードせよと言われるが、最初は気にせず"Skip This Step"ボタンを押す。

↑アプリケーションのカテゴリを指定する。ここではとりあえず「コミュニケーション」にしておく。

↑ページ上部の"Edit App Source"タブを選択し、いよいよ実際のコードを書き始める。"Canvas Surface"、"Profile Surface"、"Home surface"と3つ並んでいるうちの"Profile Surface"を選び、HTML/JavaScript Sourceの所に書き込んでいく。Firefoxで表示が少し崩れるが、気にしない。

今回使ったコードはこれだ。Viewer(MySpaceアプリケーションではインストールした人をOwner、いまブラウザで見ているひとをViewerと呼ぶ)の年齢と性別を取得して「こんにちは」と挨拶するようになっている。

<div id='heading'></div>
<hr size='1px' />
<script type='text/javascript'>
var os;
var dataReqObj;
var html = '';
var heading = '';
function init() {
    var p={};
    // どんな情報を取得したいか?
    p[opensocial.DataRequest.PeopleRequestFields.PROFILE_DETAILS] =
        [opensocial.Person.Field.ID,
        opensocial.Person.Field.NAME,
        MyOpenSpace.Person.Field.AGE,
        MyOpenSpace.Person.Field.GENDER ];
    os = opensocial.Container.get();
    // DataRequestオブジェクトの作成
    dataReqObj = os.newDataRequest();

    // RequestItemオブジェクトの作成とDataRequestオブジェクトへの追加
    var viewerReq = os.newFetchPersonRequest(opensocial.DataRequest.PersonId.VIEWER,p);

    // 要求のディスパッチ
    dataReqObj.add(viewerReq);

    // コールバック関数を指定し、送る
    dataReqObj.send(viewerResponse);
}
function viewerResponse(data) {
    var viewer = data.get(opensocial.DataRequest.PersonId.VIEWER).getData();
    var friendData=viewer;
    var friendName = friendData.getField(opensocial.Person.Field.NAME);
    var age = friendData.getField(MyOpenSpace.Person.Field.AGE);
    var gender = friendData.getField(MyOpenSpace.Person.Field.GENDER);
    var heading = 'こんにちは' + viewer.getDisplayName() + ', お前は' + age + '歳の' + gender;
    document.getElementById('heading').innerHTML = heading;
}
init();
</script>

↑書き終わり、アプリケーションのプロフィールページに行くと「アプリケーションの追加」ボタンが現れる。成功を願いながら押し込む。

↑このように表示され、うまくいったことがわかる。19歳なのはバグではなく自分のせいだ。

昨日の勉強会によると、自作のアプリケーションを他の人達に向けて公開するにはレビュー(審査)を受けないといけないらしい。主にセキュリティ面のチェック(eval使うな、とか)とのことだが、そこを通過すれば2億ユーザに使われる可能性を持つアプリケーションの誕生だ。まだ日本にはほとんど開発者がほとんどいないのだから、今のうちにたくさん練習しておいて大ブレイクを狙う、というのもいいかもしれない。

【追記】最初の開発者の登録のところで10時間以上待たされた、という人がいた。承認はもしかして人手でやっているのだろうか?