mixiアプリ.info

前回は、mixiアプリをはじめるための準備を 3 ステップでご紹介しました。

今回は、せっかく mixiアプリのデベロッパーになって「mixiアプリオープンβ （http://platform001.mixi.jp/）」にアクセスできるようになったので、いきなり mixiアプリを作ってみようと思います！

以下の 3 つの準備を整えたら、開発準備は完了です。

• テキストエディタ
• 作成したファイルを置いておくWebサーバ
• Webブラウザとデバッグ環境

さて、いよいよ開発に着手するわけですが
とにかく何でもいいから今すぐmixiアプリを公開してみたい！というのであれば
mixi Developer Center上に公開されているサンプルをそのまま使ってみると良いかもしれません。

以下は、上記サイトに掲載されている「Hello,（ニックネーム）!」を表示するmixiアプリのサンプルをほんのちょっとカスタマイズして、プロフィール写真も一緒に表示するようにしたサンプルコードです。

<?xml version=”1.0″ encoding=”UTF-8″?>

<Module>
<ModulePrefs title=”Hello, world!”>
<Require feature=”opensocial-0.8″ />
</ModulePrefs>
<Content type=”html”><![CDATA[

<div>Hello, <span id="target"></span>!</div>
<div id="photo"></div>

<script type="text/javascript">
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();
var thumbnailUrl = viewer.getField(opensocial.Person.Field.THUMBNAIL_URL);
document.getElementById("target").innerHTML = name;
document.getElementById("photo").innerHTML = '<img src="' + thumbnailUrl + '" />';
});
}
gadgets.util.registerOnLoadHandler(init);
</script>

]]></Content>
</Module>

作成したソースを拡張子 xml で保存し、httpアクセス可能なwebサーバ上に先程作成したXMLファイル設置します。
（適当なwebサーバを持ち合わせていないかたは、フリーのホスティングサーバや
Google App Engineの利用も可能だそうです）

XMLファイルの設置が完了しましたら、mixiアプリ登録準備の完了です。

サイト上部の「アプリ」メニューからアプリ一覧画面へ遷移し、検索ボタン右下の「アプリを作成する」リンク先で、登録内容を入力します。
（以下、必須項目のみ抜粋）

• アプリ名
• カテゴリ
• ガジェットURL（作成したmixiアプリXMLファイルを置いたURL）
• 登録条件と公開レベル（デフォルトで非公開のテストモードになっています）
• アプリの説明

以上を記入し、「mixiPlatform利用規約の確認」に同意すると、入力内容確認を経てアプリを作成することができます。

作成後、自分のmixiホーム上でアプリが動いていれば完成です。
ささやかな機能ではありますが、自作のmixiアプリが実際に動いているのを見るとちょっと感動しますよね。

次回は、今回サンプルとして記載したコードについて、簡単な説明をしてみたいと思います。

Post Footer automatically generated by Add Post Footer Plugin for wordpress.