mixiアプリを動かしてみよう(応用編)

2010年9月29日(水)
森 和之

クチコミを生み出そう

第1回第2回で説明したmixiアプリを広めるうえで重要ポイントとして、クチコミがありました。今回は、そのクチコミを生む上で重要な機能である「アクティビティ」「招待」「メッセージ」を使ったアプリを実際に作ってみましょう。

アクティビティ

アクティビティは、自分がアプリで遊んだ行動履歴をマイミクに通知する仕組みです。アクティビティには2種類あります。アクティビティフィードとコミュニケーションフィードです。コミュニケーションフィードの投稿はユーザーの同意が必要なのでポップアップが表示され、アクティビティフィードは、ユーザーの許可は必要なく暗黙的に投稿出来るという違いがあります。それでは、早速アクティビティを送信するコードを見てみましょう。

アクティビティを作成するにはopensocial.newActivityでアクティビティのタイトルなどを設定し、それをopensocial.requestCreateActivityを呼ぶことで投稿出来ます。

opensocial.newActivity(params)

newActivity関数の第1引数にはopensocial.Activity.FieldをキーにしたObject(hash)を受け取ります。ここではTITLEにHello!という文字列を設定しています。

opensocial.requestCreateActivity(activity, priority, opt_callback)

opensocial.requestCreateActivity関数の第1引数にはさきほどのopensocial.newActivityの結果を渡します。

第2引数ではアクティビティフィード、コミュニケーションフィードのいずれかを指定しています。opensocial.CreateActivityPriority.LOWでアクティビティフィード、opensocial.CreateActivityPriority.HIGHでコミュニケーションフィードになります。

第3引数はコールバック関数をです。ここでは無名関数を渡しています。アクティビティを送信するのはたったこれだけです。アクティビティは、遷移先のビューにパラメータを渡したり、画像をつけれたり、宛先指定が出来きます。詳しくは以下のページを御覧下さい。

詳細情報:mixi Developer Center「アクティビティを送信してみよう」

招待

次は招待を送信します。招待は現在アプリを使っているユーザーが、他のユーザーにアプリをおすすめする機能です。招待が送信されると、招待されたユーザーのhomeに赤文字で表示されます。プログラムからユーザーの同意を得ないまま招待を送ることはできず、ユーザーに招待を送信する選択画面を表示するという形式になります。招待を送信するコードは以下のとおりです。

招待を送信するにはopensocial.requestShareAppを呼び出します。

opensocial.requestShareApp(recipients, reason, opt_callback,opt_params)

第1引数にはVIEWER_FRIENDSという文字列を指定します。第2引数は無視されるので、ここではnullを渡します。第3引数はコールバック関数を指定します。コールバック関数の引数には招待を送信したかどうか、誰に招待を送信したかどうかが渡ってきます。第4引数は指定しません。

招待を送るコードは以上です。非常に単純ですが、canvasでないと招待ページが出ない、viewerがアプリを追加していなければならないなどの制限があるため、注意が必要です。また、招待のウィンドウは、アプリのiframeの上に来るため、アプリ内でFlashを使っていた場合は招待のウィンドウの上にFlahsが表示されてしまいます。一時的にFlashを非表示にしましょう。

詳細情報:mixi Developer Center「マイミクを招待しよう」

メッセージ送信

招待よりもユーザーが入力する欄が広く、プログラム主体というよりもユーザー同士のコミュニケーションを主体として、そのやりとりを補足するよようなアプリに向いていると言えます。招待と同じようにユーザーにメッセージの送信画面を表示する形式です。メッセージを送信するコードは以下のとおりです。

メッセージを送信するにはopensocial.newMessageでメッセージの詳細を設定し、opensocial.requestSedMessageを呼び出してメッセージを送信します。

opensocial.newMessage(body, opt_params)

opensocial.newMessage関数の第1引数には本文を設定します。ここではHelloという文字列を指定しています。第2引数にはopensocial.Message.Fieldをキーに持つObject(hash)を指定します。ここではTITLEにtitleという文字を指定しています。

hah.opensocial.requestSendMEssageで実際にメッセージを送信します。

opensocial.requestSendMessage(recipients, message, opt_callback,opt_params)

第1引数には送信する宛先のユーザーIDを設定します。第2引数には先程opensocial.newMessageの戻り値を設定します。第3引数にはコールバック関数を指定します。コールバック関数の引数にはメッセージの送信が成功したかどうかが渡ってきます。第4引数は指定しません。

詳細情報:mixi Developer Center「ユーザにメッセージを送信してみよう」

デバッグ

ここまで様々なJavaScriptを書いてきましたが、うまく動かないこともあると思います。うまく動かない場合はFirebugなどを使ってデバッグしましょう。JavaScriptの開発でよく話題に出てくるのがFirebugです。FirebugはFirefoxのAdd-onです。マウスの下のHTMLを表示、ブレークポイントの設定、スタックトレースの表示、ページの読み込み時間やJavaScriptの実行時間の計測、Ajaxリクエストの中身を覗くなど、デバッグに便利な機能が揃っており、JavaScriptのデバッグツールとしてはデファクトスタンダードの地位を獲得しています。

OpenSocialはHTMLとJavaScriptでブラウザ上で動くため、デバッグツールがあるとないのとでは、開発効率がだいぶ変わってきます。この連載では詳しくは解説しませんが、JavaScriptの開発で詰まったときは使ってみるといいでしょう。

また、mixiアプリではXMLのキャッシュが強力に効くため、デバッグや開発時にはそれをOFFにするのがいいでしょう。run_appli.plのurlにnocache=1をつけるとキャッシュをOFFにできます。

詳細情報:mixi Developer Center「よくあるご質問 Gadget XMLファイルのキャッシュについて」

株式会社ミクシィ

パートナーサービス部 第1プラットフォーム開発チーム
1985年生まれ。2007年に株式会社ミクシィの最初の新卒として入社。Find Job !の開発を半年間経験したのち、mixi開発グループに移動。mixiアプリのプロジェクトの立ち上げから開発を担当し、以降現在までmixiアプリ及び mixi Platformの開発をしている。

連載バックナンバー

Think ITメルマガ会員登録受付中

Think ITでは、技術情報が詰まったメールマガジン「Think IT Weekly」の配信サービスを提供しています。メルマガ会員登録を済ませれば、メルマガだけでなく、さまざまな限定特典を入手できるようになります。

Think ITメルマガ会員のサービス内容を見る

他にもこの記事が読まれています