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アプリが実際に動いているのを見るとちょっと感動しますよね。

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

誰でも簡単にmixiアプリが作れる！ポコポコアプリ

ラブレで話題の植物性乳酸菌ラクリのお試しサンプルセット

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

関連するmixiアプリ情報:

1. mixiアプリ作成入門（3）- mixiアプリのXMLを読んでみる - 前回は、「Hello,（ニックネーム）!」とプロフィール写真を表示する、簡単なmixiアプリを作成してみました。 今回は前回作成したXMLをもとに、mixiアプリのコードについて簡単な説明をしてみたいと思います。 以下に [...]...
2. mixiアプリ作成入門（6） – マイミク全員を表示する - 関東甲信地方の梅雨明け記念におもむろに投稿します。 今回も、いつものマイキーがお送りしてます。 前回はマイミク情報の取得方法についてご紹介しました。 しかし、ご紹介したサンプルではデフォルトの 20 件までしか表示されな [...]...
3. mixiアプリ作成入門（4）- 詳細なユーザ情報を取得する - 前回はmixiアプリ作成入門（2）で作成したコードについて簡単な解説を行いました。 今回は、ユーザの詳細なプロフィール情報の取得方法をご紹介したいと思います。 mixiアプリでは、以下のプロフィール情報とマイミク一覧を取 [...]...
4. mixiアプリ入門（7） – マイミク一覧でページ送りする - こんにちは、mixiのアプリ管理機能が充実しはじめててちょっとびびったマイキーです。 今回は久しぶりの「mixiアプリ入門」シリーズをおもむろに投稿します。 前回は、マイミク全員を一度に表示する方法をご紹介しました。 そ [...]...
5. mixiアプリ作成入門（5） – マイミク情報を取得する - 前回は、ユーザのプロフィール情報の取得方法についてご紹介しました。 さまざまな種類のプロフィール情報を取得することによって、mixiアプリの作成の幅が広がったかと思います。 前回までは「Owner」または「Viewer」 [...]...