2007-07

以前の記事、Facebook Widgetを作ろう！（２）の続き。

1. デペロッパー登録
2. API keyの取得
3. Widgetサーバの用意
4. Canpas Pageの実装
5. Widget一覧ページに登録

この手順の３番目から４番目までを解説したいと思います。

前回、API KEYの取得時に登録したコールバックURLがWidgetサーバになります。
コールバックURLは適宜変更できるので、php5が動くレンタルサーバ（僕はさくらインターネットを使っています。）を指定しておきましょう。

facebook_client.tar.gz
ここからphp5のクライアントライブラリをダウンロードします。

facebook-platform/client/facebook.php　とfacebook-platform/client/facebookapi_php5_restlib.phpを使うので、Widgetサーバにアップロードしておきます。

そして、これらライブラリを扱うためのインクルードファイルを作成します。appinclude.phpという名前にしておきました。ここでは主にAPI KEYやコールバックURLを定義しておきます。
ここにAPI-KEYを';$appsecret = 'ここにSECRETを';$facebook = new Facebook($appapikey, $appsecret);$user = $facebook->require_login();

//[todo: change the following url to your callback url]$appcallbackurl = 'ここにコールバックURLを絶対パスで'; 

//catch the exception that gets thrown if the cookie has an invalid session_key in ittry { if (!$facebook->api_client->users_isAppAdded()) {   $facebook->redirect($facebook->get_add_url()); }} catch (Exception $ex) { //this will clear cookies for your application and redirect them to a login prompt $facebook->set_user(null, null); $facebook->redirect($appcallbackurl);}?>

次に、このファイルをインクルードしたindex.phpを作成します。まずは簡単にuser_idを表示するもの。


これによってhttp://apps.facebook.com/Widget名/にアクセスすると、自分のWidgetサーバのコールバックURLで指定した部分のPHPファイルを実行するようになります。http://apps.facebook.com/Widget名/にアクセスすると、Widgetを自分が登録するかどうか聞かれますので、同意します。これで記念すべき1ユーザーがついたことになります。って自分だけど。左にナビゲーションがあって、右のCanvas Pageというところに自分のindex.phpの実行結果が表示されることになります。

helloにつづいて自分のユーザーIDが表示されているはずです。

そして、自分のプロフィールページを見てみましょう。前回default FBMLというフォームで登録した「Hello world」という文字がプロフィールボックスに表示されているはずです。

次回はCanvas PageとProfile Boxをいろいろと書き換えて、ちゃんとしたWidgetっぽくしていこうと思います。

こういうのはあまり信じてないのですが、やってみました。http://www55.channel.or.jp/human_labo/index.php

「エゴグラム性格診断」結果！

アナタの性格

常にパワーが全開状態、夢や理想に向かって一直線のアツイ人。周囲の誰もが一目置いています。でも、いつもいつもハイテンションで飛ばしすぎると、追突し たり対向車線にハミ出したりして、思わぬ事故や落とし穴にハマる可能性あり。また、頭がズバ抜けて良かったり器用だったりして、何でもこなせるため、アレ もやりコレもやりしているうちに、どれもこれも中途半端になってしまう恐れもありそう。 しかし最も気をつけて欲しいのは、自分の頭が良いので、他の人たちがみんな低レベルに見えてしょうがない、という事。そういう状態が続くと、周りの人たち は皆それとなく感づいて、アナタを避けるようになるかもね。それから、アナタはどこかで必ずテングになって舞い上がる可能性が、かなり高いタイプではない かと思うよ。 そういう事に気をつければ、アナタは相当伸びるタイプだろうね。

アナタの恋愛

オレほどの者だから、よりどりみどりだな、とタカをくくっていると、とんだブタをつかむ可能性もあるよ。だから若いうちから真剣になって相手選びに取り組 み、自分より顔と姿の総合点が、チョッピリ落ちると思える相手を選ぶことが、アナタのようなタイプには、絶対にグーだと思えるね。 最も気をつけなければイケナイのは、容姿はグーだが性格がパーの女性に、色仕掛けでからめ捕られないことだろうね。

アナタの適職

このタイプに属するアナタは、自分の持つ総合的能力によって、職業適性がかなり変わってくるだろうね。もし能力がずば抜けていれば、弁護士や検事などの法律家、外交官、上級公務員、医師、公認会計士、有名大学の教授、一流企業の経営陣やトップ研究員、などなどが有力。 今までの学校の成績などを見て、そこまではとてもとても行けないと思うなら、適当にランクを下げて頑張るべきだね。冷静に自分を見つめ、絶対に自分を買い被らないことが何よりも大切だね。

日本人の13.4%がこのタイプです。

だいたい違うような気がするな。けっこう有名だったから期待していたのに。
いろいろ手をだして中途半端にならないように、気をつけますー。

今日はTOEICを受けてきました。
手応えは、ぼちぼちという感じでしょうか。
今年中に750の壁はこえたいんですけど、なかなか時間を作れなくて。たまに越える夢は見るんですけどねぇ

以前の記事、Facebook Widgetを作ろう！（１）の続き。

1. デペロッパー登録
2. API keyの取得
3. Widgetサーバの用意
4. Canpas Pageの実装
5. Widget一覧ページに登録

この手順の２番目までを、こちらを参考に解説したいと思います。

1. Go to http://developers.facebook.com/
2. Click on ‘Get Started’
3. Click on ‘Add Facebook Developer Application’
4. A link to ‘Developer’ should appear in the left nav on Facebook now. Go to the Developer App.
5. Click on the button that says ‘Setup New Application’

まず最初の手順は、FB開発者サイトにいき、Developer登録する。
登録といっても、手順３まで行けば左側のナビゲーションにDeveloperというリンクが現れて、そこからデペロッパーコミュニティにいける。

（はじめは下の方にあるので、moreをクリックしてすべてのリンクを表示させる。editでナビゲーションメニューの並び替えを行い、上部にだしておくとよい。）

Depeloperコミュニティの右上にあるSetup New Applicationボタンをクリックする。
するとWidgetの名前やURLなどを登録するフォームが表示される。

1. Application Name: for our app, we put ‘Tutorial Application‘ – you should put in a different name.
2. Check the Terms of service box.

ここの情報はあとで変更できるので、とりあえずtestと入れる。
そして下のチェックボックスにチェックをいれることで、Platformの利用規約に同意したものとされる。
もちろん同意しましょう。

次に、Optional Fieldsを開くとWidgetのさまざまな情報を記入するフォームがでてきます。
が、必要なものだけの記入でいいですし、あとで変更もできます。

1. Click on the Optional Fields link – this will bring up more options.
2. Support E-mail: your Facebook contact email may be filled in automatically, but you might not want to give out your personal email to everyone who adds your app! You do have to put a valid email address that you can check, however.
3. Callback Url: for our app, we put ‘http://tperry256.dreamhost.com/f8/tutorialapp/‘ – you should put something DIFFERENT – in particular, you should put the url of the directory on your server where you will create your application.
4. Canvas Page URL: http://apps.facebook.com/: for our app, we put ‘tutorialapp‘ – you must put in a different name.
5. Use FBML: keep this setting.
6. Application Type: leave this set to ‘Website’.
7. Can your application be added to Facebook: set to ‘yes’ – this will bring up more options.

必要なものとは、

• Support E-mail
• Callback Url
• Canvas Page Url
• Application Type
• Can your application be added on Facebook?
• Post-Add URL
• Default Profile Box Column
• Side Nav URL

という項目だけです。
e-mailは自分のものを入力してください。

Callback UrlはWidgetをアップするサーバ（これはあくまで自分で用意しないといけません。）のUrlを記入します。つまりWidgetのためのファイルはすべてこのサーバに置き、Facebookから呼び出されるという形になります。

Canvas Page URLというのは、Facebook内に設けられたWidgetのメインページなるものです。
そのページのURLをまず決めます。これはユニークなものになりますので、そのようにしましょう。かぶっている場合はnot availableのアラートがでてくれます。
Use FBMLとUse iFrameがありますが、 Canvas PageをFBMLで書くか、そのままiFrameで表示するかということです。
FBMLを使うことによって楽なことや安全性を保証できることも多々あり、こちらが推奨されていますが、HTMLでいいという方はもうiFrameでいいと思います。つまり前者の場合はCallback Urlのページ（index.php）にFBMLとHTMLを記述し、後者の場合は普通のHtmlを記述するという感じです。iFrameの場合はFBMLを使っても変換されないのでご注意。ただjavascriptなどはiframeで使用することができますが、facebookに一回かます場合は制限がかかっています。

Aplication Typeは もちろんWebsiteにします。デスクトップWidgetをつくる場合はここをDesktopと選択します。

そして、Can your application be added to Facebookにyesをいれることで、またオプション設定フォームが表示されます。他の部分は空白でかまいません。

次のフォームには以下のように記入していきます。

1. Post-Add Url: for our app, we put ‘http://apps.facebook.com/tutorialapp/‘ — you should put something DIFFERENT – in particular, you should put your full canvas page url.
2. Default FBML: type in the text ‘hello’.
3. Leave everything else under Installation Options blank.

Post-Add URLには先ほど定義したCanvas PageのURLを記入。
これはユーザーがあなたのWidgetを登録した後にどのページに行くかを定義します。そのWidgetのトップページが無難なので、Canvas PageのURLの入力しておくのがよいと思います。

ユーザーがあなたのWidgetを登録したら、最初の方で説明した「developer」のように左のナビゲーションエリアにリンクが表示されます。さらに自分のプロフィールページにWidgetのprofile boxが表示されます。
Default FBMLというのは、 ユーザーがWidget登録した時profile boxに表示される内容で、今回は「Hello world」と書きます。つまりこのWidgetをユーザーが登録したらプロフィールにTest（このwidgetの名前）と下に「Hello world」というボックスが表示されるわけです。

Default Profile Box Columnはそのprofile boxが狭い側（自分の写真の下のスペース）なのか広い側なのかを定義します。

1. Leave everything else under Installation Options blank.
2. Side Nav Url: for our app, we put ‘http://apps.facebook.com/tutorialapp/‘ — you should put something DIFFERENT – in particular, you should put your canvas page url here as well.
3. Leave everything else under Integration Points blank.

最後にSide Nav UrlにCanvas PageのURLを入れます。これは左のナビゲーションに表示されるリンクをクリックした時に遷移するページのURLを定義しています。つまり Canvas Pageに遷移するのが一番好ましいです。

あとはすべて空白のままで構わないので、Submitボタンを押します。

これでWidgetをつくるためのAPI keyが発行されます。

1. デペロッパー登録
2. API keyの取得
3. Widgetサーバの用意
4. Canpas Pageの実装
5. Widget一覧ページに登録

手順の２番目まで終わりました。
次回は、phpのfacebookライブラリをいれてWidgetとして動かすところまでを解説したいと思います。

以前、Facebookにみるプラットフォームビジネスという記事を書きましたが、今回は実際にWidgetを作ってみよう！という内容です。

第一回目の今回は、Facebook Platformに関してざっくり説明したいと思います。

Facebookのオープンプラットフォーム化によって、開発者やサードパティ企業がFacebook Widgetを作れるようになり、圧倒的な集客力の上で自分のアプリ（Widget）をリリースすることができるようになりました。

実際には、APIが解放され、それを使ったWidgetを自分のサーバに構築します。RESTでリクエストするかんじで、クライアントライブラリとしてphpやJava、非公式ですが、PerlやRuby、action scriptなどもサポートされています。

Platformについての詳細はFacebookの開発者サイトから参照できます。

Facebook Depelopers
http://developers.facebook.com/

Facebook Platformには独自の言語が二つほどあります。
FQLとFBMLです。

FQL:
Facebook Query Language, or FQL, allows you to use a SQL-style interface to more easily query the same data that you can access through other Facebook API methods.

SQLライクなインターフェースでAPIコールするので、詳細な検索クエリを投げるときなどに向いています。
もちろん生DBをたたきにいっているわけではなく、変換されるものです。

FBML:
Facebook Markup enables you to build full Facebook Platform applications that deeply integrate into a user’s Facebook experience. You can hook into several Facebook integration points, including the Profile, Profile Actions, Canvas, News Feed and Mini-Feed.

Facebookで定義されたマークアップ言語で、Facebook風のボタンやプロフィール写真などを簡単に扱うことができます。このFBMLによってFacebookっぽいWidgetを簡単につくることができます。
ドキュメントはこちら。

実際にWidgetを開発して、Facebook内に登録するフローは以下のようになります。

1. デペロッパー登録
2. API keyの取得
3. Widgetサーバの用意
4. Canpas Pageの実装
5. Widget一覧ページに登録

次回はこちらを参考に、デペロッパー登録からAPI keyの取得までを解説したいと思います。

学校の活動とは別件で、BASIC認証のかかったディレクトリのRSSを引っ張ってくるという作業に出くわした。

XML_RSSをつかってRSSをパースするんだけれども、その前に HTTP_Requestでヘッダ情報を付与しないといけない。

setBasicAuth(‘ID’, ‘PASS’);

こんなもん。

さらに、引っ張ってきたエントリーを投稿時間順にソートするのだが、phpで多次元配列のソートははじめてだ。はてとググルとusortという関数があるようだ。

bool usort ( array &array, callback cmp_function )

callback cmp_functionとして比較用の関数を定義するわけだ。
これによって投稿時間のソートを実現し、マージされたXMLが完成。

僕の母校、広島県立庄原格致高校。
進学校でもなければスポーツ校でもない田舎の小さな高校です。

そんな高校にも小さなラグビーがあり、生徒が汗を流しているわけです。僕はOBとしてウェブサイトなどを作りましたが、最終的にマネージャーが毎週更新してくれるブログが結果的に一番内容のあるコンテンツとなりました。

http://blog.livedoor.jp/kakuchi_rugby/

で、ついに最後のマネージャーが現役を退き、更新する人もいなくなりました…

こうしてみると２年間もよくがんばってくれたと思います。
２年間をパラパラと読み返して、ブログでもつくってよかったなぁと。

特に最後の子はひとりでも本当によくやってくれた。

この記事いつかググってみてくれたらいいな。

ありがとう！

君たちの一生懸命な足跡がウェブ上に残るってのも悪くないと思うよ。

舞妓Haaaan!!!を見てきました。

阿部サダヲの壮絶なるハイテンションムービー。

序盤から中盤にかけてはかなり楽しめました。
終盤となると映画として成り立たせるためのいろいろがあるのですが、それまでのテンションとそのへんのギャップがね。。

京都の映画館で見たのですが、お座敷遊びにかなり興味わきました。

が、一見さんなのでねー
いつかは行ってみたいなぁと思いましたよ。

「もちろんそうだ！」

が個人的に最高につぼでした。