PHPでFacebookアプリ作ってみた(1)

※この記事の情報は古いです。
現在はFacebook API v2.0になっており、一部権限で申請と承認が必要になっています。
詳しくは、Facebook APIの仕様がかわったFacebook APIの承認がおりましたを御覧ください。

どーもどーも。
ユウです。

最近GoogleのWEBマスターツールでブログ情報を見ていたら「Facebook Developer」っていう検索ワードで流入された方がいました。
しかし、そんな情報は全く無い!!笑
さぞかし失望されたことでしょう…ということで書いちゃいます。

Facebook Developer登録

Facebookアプリの開発にはDeveloper登録が必要です。
えっ…?と身構えてしまう方もおられるかもしれませんが、MacやiPhoneなどのアプリの開発と違い、無料で登録できるのでご安心ください。

登録にはFacebookアカウントと携帯電話、またはクレジットカードが必要です。
※携帯電話とクレジットカードは本人確認のためなので、初回に入力すれば以後必要ありません。

開発者登録(Developer登録)は以下のURLから行なえます。
https://developers.facebook.com/

Facebook Developer Pageなぜか英語だらけですが。。。
「アプリ」をクリックします。

Facebook Developer 登録Facebook開発者アプリを許可します。
FacebookのDeveloper用サイトもFacebookアプリで作られているのが面白いですね。

Facebookアプリ作成「新しいアプリケーションを作成」をクリックします。

Facebookアプリ作成アプリの名前を登録します。

Facebookアプリ作成これは他のアプリとかぶるとダメなので右にValidと出てることを確認します。
書く必要があるのはApp Nameのみで構いません。

Facebookアプリ作成読みにくい文字を入力します。
うーんわかりにくい…。

Facebookアプリ作成登録しようとしたらエラーが出ました。
携帯電話かクレジットカードを登録しろ。と。
しかたないのでクレジットカードで認証することにします。
※これは本人確認のためなので携帯電話認証でも構いません。

Facebookアプリ作成Facebookのパスワードを入力して続行

個人情報で認証クレジットカード情報を入力します。
そして保存

再度アプリ登録を試みます。
facebookアプリ作成むちゃくちゃ読みにくい文字を入力して…

Facebookアプリ登録こんどは出来ました。
App IDとApp Secretは重要なのでメモっておきます。
そしてアプリの登録です。
下の方に以下のような項目があります。

Facebookアプリ登録今回はWEBサイト上にFacebookアプリを作りたいので、「ウェブサイト」を選びます。
出てくるボックスにサイトURLを入力します。

Facebookアプリ登録最後は「変更を保存」をクリックして終了です。

Facebookアプリ登録完了お疲れさまです。
これで登録は完了しました。

Facebook APIを使ってみる

では、さっそくPHPでFacebook APIを使ってみましょう!
まずFacebook SDKが必要になります。
このサイトからもダウンロード出来るようにしておきますね。
Facebook SDK

このSDKファイルにはサンプルをつけときました。
同梱されているindex.phpのYOUR_APP_IDとYOUR_APP_SECRETを書き換えるだけで動作すると思います。
同梱したindex.phpの中身です。

<?php
//Facebook SDKの読み込み
require_once('src/facebook.php');
//Facebookアプリ情報
//ここを書き換える
//YOUR_APP_ID : Facebook Developerページで取得したApp ID 
//YOUR_APP_SECRET : Facebook Developerページで取得したApp Secret 
$config = array(
	'appId' =--> 'YOUR_APP_ID',
	'secret' => 'YOUR_APP_SECRET',
);
$facebook = new Facebook($config);
//facebookのユーザーID取得
$user_id = $facebook->getUser();

if($user_id) {
	//ユーザーIDが空っぽじゃない場合
	try {
		//ユーザー情報を取得
		$user_profile = $facebook->api('/me','GET');
		//ユーザーの名前を表示
		echo "ようこそ!" . $user_profile['name'] ."さん!";
	} catch(FacebookApiException $e) {
		//エラー時の処理(ログインしてね。の表示)
		$login_url = $facebook->getLoginUrl();
		echo '<a href="' . $login_url . '">ログイン</a>してね。';
		//エラーログ出力
		error_log($e->getType());
		error_log($e->getMessage());
	}
} else {
	//ユーザーIDが取得できない場合(ログインしてね。の表示)
	$login_url = $facebook->getLoginUrl();
	echo '<a href="' . $login_url . '">ログイン</a>してね。';
}
?>

Facebookアプリサンプル実行すると「ログインしてね。」とでます。
ログインを押しましょう。

FacebookアプリサンプルFacebookのアプリ認証画面へ飛びます。
「このアプリはあなたの基本情報にアクセスします」と。
「アプリへ移動」をクリックすると戻ってきます。

FacebookアプリサンプルそしてFacebookに登録した名前が表示されます。

今回のアプリはログインする機能とログインした人には名前を表示する機能…だけというシンプルな作りですが、応用は色々と出来ますね。
FacebookのAPIはとても使いやすくてシンプルです。
また、これに数行追加するだけでウォール投稿も出来ちゃいます。
でも、それはまた次回。

では。

    • トラ
    • 2013 10/11 3:23pm

    こんにちは。
    別の分ではお世話になっております。

    今、ログイン情報といいねを押してね。というメッセージを作ったPHPをサーバへアップし、
    https://www.facebook.com/dialog/oauth?client_id=IDIDID&redirect_uri=http://xxxx.net/eeee/

    で確認をすると、ちゃんと、動いているようです。
    ですが、ウインドウはfacebook内ではなく、普通のweb上で動いてる状態です。
    そのあと、http://apps.facebook.com/xxxx
    で確認してみると「サーバーが接続を拒否しました」となるのですが、
    これは認証などの方法が悪いのでしょうか?

    動きが変わってしまうのは何が原因なのかが・・・わからなくて・・・
    すみません・・・・よろしくお願いします。

      • yu29ozaki
      • 2013 10/11 8:20pm

      頂いたURLはどちらもアクセスできず、ソースコードなどもないので、詳しいことはわからないのですが2つほどご確認ください。

      1. Facebook上のアプリとFacebookでログインが可能なサイトの2つで、自サーバーにアップしたURL(※https://apps.facebook.com/xxxxxではない。)を登録して下さい。
      2. この際、Facebook上のアプリでは通常URL(http通信のもの)とセキュアURL(SSL、https通信のもの)両方が必要です。というのもFacebook側がhttps通信なので、そちらに合わせないとセキュアでなくなってしまうためです。これは必須です。
      3. 上記設定を確認した上で、通常URL(apps.facebook.comではない)でアクセスし、ログインが出来るかご確認下さい。

      これ以上はこちらではなんとも言えませんので、FB APIに詳しい方をご存知であればソースコードごと持って行ってみてもらうのも良いかもしれません。
      WEB上にも良い情報がたくさん転がっています。また、本も少しは出ているようなので調べてみてください。
      Facebook APIは仕様が頻繁に変更になるのと、少し使い方になれていないと難しい部分もあるので、まずはapps.facebook.com以外のアクセスで動くものをいくつか作って慣れると良いかもしれません。※apps.facebook.comのアクセスはiFrameでのアクセスやPOSTによるデータ送信などが絡み、すこし癖があります。

    • Isreal
    • 2014 08/20 1:22pm

    Thanks for sharing excellent information

return top