404 motivation not found | t_ishidaのブログ

2月/10

3

OpenSocial(2)

GadgetXML

要約するとHTMLを書くためのXMLです。
こんなんです。

<?xml versionmixiアプリでは="1.0" encoding="UTF-8"?>
<Module>
  <!-- モジュールの設定をゴニョゴニョ書きます  -->
 <ModulePrefs title="アプリケーションのタイトルを書きます" description="アプリケーションの概要を書きます">
    <!-- 使う機能なんかをここで設定できます -->
  <Require feature="opensocial-0.8"/>
 </ModulePrefs>

  <!-- プロフィールページのガジェットとして出すやつの定義 -->
 <Content type="html" view="profile">
 <![CDATA[
  <p>プロフィールページに出すコンテンツを書きます。mixiで言えばprofile.pl?id=hogehoge</p>
 ]]></Content>

  <!-- homeページのガジェットとして定義するやつ-->
 <Content type="html" view="home">
 <![CDATA[
  <p>プロフィールページに出すコンテンツを書きます。mixiで言えばhome.pl?id=hogehoge</p>
 ]]></Content>

  <!-- canvasとして定義するやつ-->
 <Content type="html" view="canvas">
 <![CDATA[
  <p>アプリを全面起動できるページに出すコンテンツを書きます。mixiで言えばrun_appli.pl</p>
 ]]>
 </Content>
</Module>

見てもらうと分かると思うんですが、つまりはgadget.xmlのタグの中にHTMLの断片を書き込むだけです。そうすると、view=”ほげほげ” アトリビュートの指示に従ってOpenSocialコンテナが適当にiframeの中に書き出してくれてガジェットとして扱えるという代物ですね。勿論、単にHTMLを出すだけだとアプリでもなんでもないので、JavaScriptを使ってゴニョゴニョするというのが目的になっていく訳です。

さて、ソース中のコメントやら何やら見てもらうと分かると思うんですがcanvas,home,profile というviewについて定義しています。各ページの意味についてはソースの中に書いてあるので適当に想像してください。
一応まとめておくと

  • canvas – 全面でアプリケーションを実行できるview
  • profile – プロフィールページの横にちょろっと出すガジェット。当然ですがガジェットのownerのプロフィールにまつわるコンテンツを出力してあげるべきでしょう。このページは主にownerのプロフィールを見に来たユーザーの目に触れることになります。
  • home – ユーザーのhome(ログイン直後に表示されるページ。ダッシュボードとか)の横にちょろっと出す。ガジェット。当然ですがログイン直後に表示されるものなので、アプリケーションの概況を出してあげるのが好ましいでしょう。

他にpreviewというビューがあるのですがmixiが対応していないため、今回は試していません。よって詳しいことは書けません。アプリケーションをインストールするためのショーケースで表示されるコンテンツのようです。

なお、ちゃんとしており、かつ詳細な情報が欲しい人、または、t_ishidaの失礼な口調が嫌いな方は、本家を参照してください。ただ、SNSのOpenSocialコンテナごとに実装してたりしてなかったりするようなのでRFCを読む気分で読むことをお勧めいたします[要出典]

gadgetsオブジェクト、opensocialオブジェクト

当然ですが単にJavaScriptとHTMLの断片をSNS上で動かすだけではSNSの上でやる意味はありません。gadgetsオブジェクトというのがOpenSocialコンテナの上では使えます。
こいつを通して、実行者のプロフィールを取得したり、実行者の友達のプロフィールを取得したり、外部サーバーにJSONP使わずにリクエストしたりしてマッシュアップ(笑)をしてアプリケーションの面白味を出していくことになる訳です。

出来ることは本家を参照のこと。

独断と偏見的に大事なのは、

gadgets.io.makeRequest();
opensocial.Person;
opensocial.Activity;
opensocial.Message;

辺りだと思うので、この辺を読んで出来ることのイメージを掴むと良いと思います。

とは言えJavaScriptでゴリゴリ書くのとかアレだよね・・・・とか思っている人も多いんじゃないかと思います。普段からJavaScriptを扱う人でもJSばっかで作らなきゃイケないとか思ったら、ちょっと凹むと思います。なのでmixiアプリを見てみるとFlashが多いわけですね。FlashからJavaScriptの色々をキックする事が出来るようなので、そういう作り方をしているのでしょう。

RESTful APIとOAuth

OpenSocialでは”key => value ストレージ”を用意してくれているみたいなので、それさえ使えばJavaScriptだけでデータの永続化が可能なアプリが作れます!やったね!な感じなのですが、さすがGoogleさんが考えただけあって、実にストイックな発想です。ちょっと複雑なものになってきたら、そうもイカないでしょう。自前でサーバー用意して自分のサーバーでゴニョゴニョしたりして通信したいですよね。ここで出てくるのがRESTful APIとOAuthです。自分のサーバーからアクセスしてきているユーザーの認証をしたりJavaScriptのopensocialオブジェクト相当のデータを取得したりするのに使います。ですが、mixiさんはPC向けのRESTful APIはPeople & Friendしか開いていないので、全面的にアクセスできる訳ではありません。というかPC向けのRESTful APIからActivityを流し込んだり出来ないので普通の単体で動くWebアプリにOpenSocialをアドオンしてソーシャルアプリ化したものをiframeを使って転用するとかは出来ない訳です。ちなむと携帯電話向けのRESTful APIでは、やれるみたいです。
とりあえず、mixi向けにPC用のソーシャルアプリを作るときにはちゃんとJSで作れという事みたいです。他人の褌で相撲とろうとしてるので、その褌にサイズを合わせるしかありません。血涙流しながらやっていきましょう。

さて、やる気が尽きたので、この辺で。
次は実際に作ってみたり、開発環境を説明したりしたいと思います。

Share and Enjoy:
  • Digg
  • del.icio.us
  • Google Bookmarks
  • Tumblr
  • email
  • Facebook
  • FriendFeed

RSS Feed

コメントはまだありません。

Leave a comment!

<< 今日の昼飯

OpenSocial (1) >>

Find it!

Theme Design by devolux.org

Tag Cloud