FacebookのOpen Graphアプリを作りApp Centerに登録するには：無料クラウドでできるFacebookアプリ開発入門（5）（5/5 ページ）

[亀渕景司，株式会社pnop] PC用表示関連情報

LINE

Hatena

前のページへ | 　　　　　　

Open Graphアプリの動作確認

　Azure上への配置が完了した後、Webブラウザを開き、「http://｛WebアプリのURL｝/gift」を表示します（例：http://yourwebapplication.cloudapp.net/gift）。

　ギフト一覧から対象のリンクの「Details」リンクを選択し、Facebookの「Login」ボタンをクリックし、Facebookへのログインと作成したFacebookアプリへのアクセス許可を行います。

図21　Facebookアプリのアクセス許可ダイアログ

　ログイン後、「Donate」ボタンをクリックしてOpen Graphアクションを実行します。正常に完了した場合、アクションIDが返されます。

図22 Open Graphアクションの実行と結果

　Facebookのタイムラインを表示し、先ほどのOpen Graphアクションが最近のアクティビティなどで表示されることを確認します（※サマリは5件以上アクションがないと表示されません）。

図23　タイムラインの表示

　正しく表示されましたでしょうか？もし、Open Graphアクションが失敗したりする場合はOpen Graphオブジェクトとしてメタ情報が正しく定義されているか、JavaScriptが正しく動作しているか等を確認しWebアプリを修正しましょう。

　米国時間の5月9日に、Facebookが独自のマルチプラットフォームアプリストアとして「App Center」を発表しました（参考：Facebook、マルチプラットフォームのアプリストア「App Center」を発表）。

　App CenterはFacebook関連のWebアプリやiOS、Android向けのアプリの検索や、ダウンロードできるオンラインストアです。この新しいオンラインストアでは有料アプリの登録も可能になり、従来のアプリ内課金だけではなく、より開発者にとって有益な仕組みが提供されることになります。

　App Centerに公開するには、Facebookアプリの管理画面から必要情報を登録し、申請・承認される必要があります。

　Facebookアプリ管理画面のメニューから［App Center］を選択し、アプリの詳細ページに関する情報の入力と各画像を登録します。

図24　App Center情報の入力

　各画像はアプリがサポートするプラットフォームによって異なる場合があります（Facebookアプリの基本設定に基づきます）。

　App Centerの設定画面に表示される項目は自動的に対応するプラットフォーム用の項目が表示されるので、適切なサイズと役割の画像をガイドラインやチュートリアルを参考に用意します。

　設定後、実際にどのように表示されるかは［プレビュー］ボタンをクリックすることで確認できます。

図25　プレビューの様子

　最後に、Facebookアプリ管理画面のApp Centerから［Submit App Detail Page］ボタンをクリックして申請します。

　なお、申請後はFacebookによって承認されるか、申請をキャンセルするまで情報を編集できなくなるので、注意が必要です。

　本稿ではOpen Graphの基本と、Open Graph対応Webアプリケーションについての基本について解説しました。FacebookとOpen Graphによるソーシャルグラフの拡張は今後ますます広がり、ユーザーの活動や体験をより密接に結び付けてくれることでしょう。

　また、新しいApp Centerを利用することで利用者への訴求とマネタイズがより便利に行えるようになります。

　本稿を参考に、新しいソーシャルネットワークへの第一歩を踏み出していただければ幸いです。

■ 参考リンク

「無料クラウドでできるFacebookアプリ開発入門」バックナンバー