CakePHP2.2.3でFacebook連携して自分の友達の女の子の画像を一覧で見てみる (CakePHP Advent Calender2012 1日目)

ついに今日から25日まで続くAdvent Calenderが始まりました。 CakePHP Advent Calender2012の1日目を担当させていただく、たがみ(@DAI199)です。

Cakeを使い始めて半年程度の新米ですが、僕の知識をみなさんに共有するために今回の記事を書きたいと思います。

CakePHPアドベントカレンダー2012本家 http://www.adventar.org/calendars/40 Twitterハッシュタグ #cakeadvent2012

普段はFacebookと連携したアプリを量産しているため、今回の記事では、CakePHPとFacebookを連携し、ちょっとしたアプリを作ってみたいと思います。 デモアプリはこちら

>>> 女の子の画像一覧を見てみる

Facebookログインの実装

それでは早速Facebookログインを実装していきましょう。 以下のURLからFacebookSDKをダウンロードします。 >>> https://github.com/facebook/facebook-php-sdk

それをインストールしたCakePHPのapp/Vendorフォルダに入れます。ここではフォルダ名は「facebook」へ変更しました。

次に「AppController.php」に以下のコードを書きます。ここでやっていることは、Facebookに接続することと、Facebookでログイン出来たことを確認するためにSessionに書き込むことです。

<?php
App::uses('Controller', 'Controller');
class AppController extends Controller {
    public $facebook;
    public $helper = array('Html', 'Form', 'Session');

    function beforeFilter(){
        App::import('Vendor', 'facebook/src/facebook');
        $this->facebook = new Facebook( array(
                        'appId' => 'APPID',
                        'secret' => 'APPSECRET',
                        'cookie' => true 
                        ));

    }

    // Facebookで接続するときにOAuthを通す
    public function authFacebook() {
        $login_url = $this->facebook->getLoginUrl(array('scope' => 'email,publish_stream,user_birthday,user_education_history,user_likes'));
        $this->redirect($login_url);
    }

    public function connectFb(){
        $fb = $this->facebook->getUser();
        if(empty($fb)){
            $this->authFacebook();
        }
        $this->Session->write('Facebook.id', $fb);
    }
}

上記のコードのAPPID,APPSECRETの部分はFacebookアプリを作成していれてください。 Facebookアプリを作成するためには以下のURLから作成します。 >>> https://developers.facebook.com/

これでFacebookログインが実装出来ました。

Graph APIを叩く

初期画面でFacebookログインボタンを表示して、クリックするとdisplayのほうへリダイレクトされます。 以下コードになります。

【Controller】 FacebookController.php

<?php
class FacebookController extends AppController {
    public function index(){
        if($this->request->is('post')){
            $this->redirect(array('action'=>'display'));
        }
    }

    public function display(){
        // Facebookへ接続
        $this->connectFb();
        $fb = $this->facebook->getUser();

        // Friend List を取得
        try {
            $me = $this->facebook->api('/me');
            $friend_list = $this->facebook->api("{$fb}/friends?fields=gender");
        } catch (FacebookApiException $e){
            error_log($e);
        }
        $this->set(compact('fb'));
        $this->set(compact('me'));
        $this->set(compact('friend_list'));
    }
}

Viewのほうはこんな感じに書いてみました。

【View】 index.ctp

<form action="<?php echo $this->Html->url(array('action'=>'index'));?>" method="post">
    <button>Facebookログイン</button>
</form>

display.ctp

<h1>自分の顔</h1>
<img src="https://graph.facebook.com/<?php echo $fb;?>/picture?width=150" alt="" />

<h2>異性の顔((´^ω^))</h2>
<?php for($i=0; $i < count($friend_list['data']); $i++):?>
    <?php if($me['gender'] != $friend_list['data'][$i]['gender']):?>
        <a href="https://www.facebook.com/<?php echo $friend_list['data'][$i]['id'];?>">
            <img src="https://graph.facebook.com/<?php echo $friend_list['data'][$i]['id'];?>/picture?width=100&height=100" alt="" />
        </a>
    <?php endif;?>
<?php endfor;?>

以上のコードによりGraphAPIを叩くことが出来ました。 GraphAPIについては、Facebookの公式ドキュメントを読むとよいです。

女の子一覧を見てうはうは

さて、それではログインしてみましょう。 自分の友達の女の子でもうはうはです。 あ、もちろん女性の方は男性が表示されます。 女性の方が女性を見たい場合は、Viewの部分をちょちょっといじると出来ますよ。

デモはこちら >>> 女の子一覧を見てうはうは

最後に

すごい簡単なアプリですが、Facebookを使ったアプリを作ったことがない人にとっては新鮮なのではないでしょうか。 これをもう少し改良すれば異性を解析するアプリを作ったり本格的なアプリも出来そうですね。

初めてのAdventCalenderで緊張していますが、わかりにくいこと、間違っているとこ、こうしたほうがいいよ！ってとこがあればぜひコメントを残してくださるとありがたいです。

CakePHP AdventCalender2012 2日目の担当は、@fukayatsuさんです。よろしくお願いします！！

関連記事: