復興ログ

未来の被災地にいるアナタと数十年後のキミたちへ。すべての記録を残します。

AKB48で学ぶFacebookアプリとファンページの連携方法

Facebookでファンページを作ったはいいものの、独自のコンテンツを提供しようとしたら、アプリと連携をさせたいところですよね。
そこで、連携方法を調べてみました。

ここで必要となるのはFacebook

  • 自分で開設したファンページ
  • 自分で開発するアプリケーション

となります。

連携することで、サーバーからファンページへ以下のような、自動投稿が可能になります。
f:id:hebita164:20101025005727p:image

ファンページを作る

ファンページの作り方はこちらのエントリーを参照してください。
5月に書いたエントリーですが、それ程、変更されていません。

アプリケーションを作る

facebook アプリの作り方・PHP 編(2010 年 10 月版)を参照して。
マイアプリケーションのページから新規アプリケーションを作成してください → http://www.facebook.com/developers/apps.php
Sanbox Mode ONにしておいたほうが良いと思います。

  1. アプリケーションIDを取得
  2. シークレットキーを取得
  3. facebook PHP SDK をダウンロード

これで準備が完了です。

アプリの認証

まず、自分の作ったアプリを自分のアカウントにインストール「いいね」します。
f:id:hebita164:20101024213522p:image

認証用アプリの作成

以下のアプリをサーバへアップロードし、アクセスします。
認証をさせるだけなら、アプリ作成時の「キャンバスページ」内で動作させる必要もないみたいです。
なので、access.phpとでも名前を付けてサーバへアップロードしてください。

<?php
require_once('facebook.php');

header("Content-type: text/html; charset=utf-8");

$facebook = new Facebook(array(
	'appId'  => 'アプリケーションID',
	'secret' => 'シークレットキー',
	'cookie' => true,
));

// さくらインターネットの場合
Facebook::$CURL_OPTS[CURLOPT_SSL_VERIFYPEER] = false;
Facebook::$CURL_OPTS[CURLOPT_SSL_VERIFYHOST] = 2;


$session = $facebook->getSession();
if (!$session) {
	$url = $facebook->getLoginUrl(array(
		'canvas' => 1,
		'fbconnect' => 0,
		// status_updateステータス更新
		// publish_streamフィードへの書き込み許可
		// manage_pages管理しているファンページへのアクセス許可
		// offline_accessオフラインでのアクセス許可
		'req_perms' => 'status_update,publish_stream,manage_pages,offline_access'
	));
	// アプリ未登録ユーザーなら facebook の認証ページへ遷移
	echo "<script type='text/javascript'>top.location.href = '$url';</script>";
	exit();
	
} else {
	try {
		$me = $facebook->api('/me'); // 自分の情報を取得
		$pagesData = $facebook->api('/me/accounts');
		
		echo "<pre>";
		print_r($me);
		print_r($pagesData);
		print_r($session);
		echo "</pre>";
	} catch (FacebookApiException $e) {
		echo  $e->getMessage();
		exit();
	}
}

?>

アップロードしたファイルへアクセスします。
f:id:hebita164:20101024215048p:image
認証の許可を求めるfacebookの認証ページへリダイレクトされます。
ここで「許可する」を選択することで、アプリのアクションを許可することになります。
許可すると、facebookのアプリページにリダイレクトされます。


ここで認証をしたアプリの挙動の変更はアプリケーションとウェブサイトから変更が可能です。


これで、「アプリへ自分の権限を委譲」したことになります。
ポイントは

'req_perms' => 'status_update,publish_stream,manage_pages,offline_access'

のパラメータです。

アプリのアクセスを許可し、Facebookのアプリページへリダイレクトされると、sessionの情報が得られます。
$meには自分のアカウント情報が入ってきます。
$pagesDataには自分が管理しているファンページの情報が入ってきます。
$sessionには自分のセッション情報が入ってきます。

ファンページのid
$pagesData['data']

この配列の該当ファンページのidをメモっておきます

ファンページ管理者のアクセストークン

ファンページへtwitterbotのように書き込むには「管理者のアクセストークン」が必要となります。
そのアクセストークンは$sessionに詰まっています。
ここで注目すべきは

$session['expires'] = 0

です。
これは、'req_perms' => 'offline_access'のoffline_accessを与えることで、アクセストークンが無期限で利用可能になることを意味します。

$session['access_token']

これが権限を委譲したアプリから、自分が管理しているファンページへ書き込むための「アクセストークン」となります。
このアクセストークンをメモります

ファンページへ自動投稿

それなりに需要がありそうな、サーバーからのファンページへの自動投稿の方法です。
以下のプログラムをサーバ側で叩くことで、大島優子ファンページへ自動投稿することが可能です。
postFanpage.php

<?php
require_once('facebook.php');

$facebook = new Facebook(array(
	'appId'  => 'アプリケーションID',
	'secret' => 'シークレットキー',
	'cookie' => false,
));

// さくらインターネットの場合
Facebook::$CURL_OPTS[CURLOPT_SSL_VERIFYPEER] = false;
Facebook::$CURL_OPTS[CURLOPT_SSL_VERIFYHOST] = 2;

// メモった管理者のアクセストークン
$user_token = '*************************************************';

// 大島優子ファンページID
$pagesId = '106151789452763';

$facebook->getLoginUrl(array(
	'req_perms'=>"publish_stream,offline_access,user_status,read_stream,email",
));

// ログイン
$pagesData = $facebook->api('/me/accounts','GET',array('access_token'=>$user_token));
foreach($pagesData['data'] as $data ){
	if ($data['id'] == $pagesId) {
		$oshimaPages_token = $data['access_token'];
		break 1;
	}
}

$status = 'ヘビーローテーション';
$attachment = array(
	'message'=>$status,
	'name'=>'大島優子',
	'access_token'=>$oshimaPages_token,
);

$statusUpdate = $facebook->api("/$pagesId/feed", 'post', $attachment);

?>

投稿結果はこちらです。
f:id:hebita164:20101024232619p:image

その他連携

Application Profile Pageの以下の場所をクリックして、ファンページのタブに組み込むことができます。
マイアプリケーションの該当アプリの編集>設定を編集>Facebook Integration
アプリケーションの情報を編集します。
f:id:hebita164:20101024231434p:image

この場合だと、アプリケーションにtab=1が引数で渡された際に、タブの動作をするようになります。

アプリを自分の管理するファンページに埋め込みます。
f:id:hebita164:20101024231435p:image

こうすると、ファンページにアプリの動作を埋め込むことが可能になります。
f:id:hebita164:20101024232325p:image

まとめ

mixiが出すmixi graph apiの練習になると思いました。
Facebookが出しているAPIドキュメントを読み解くまで時間がかかったのですが。。
APIドキュメントが全てなわけですが。例えば、

Friends: https://graph.facebook.com/me/friends

このGraph API

$facebook->api('/me/friends');

のアクセスということになります。

エントリポイント、メソッド(GET or POST)、パラメータの配列

という形でAPIにリクエストをすることになります。
どこかで見た形式だなと思ったら、twitterのOAuthライブラリのアクセスと同じ方法でした。

この感覚でドキュメントを漁らないとダメですね。。

ファンページの運用は、これから日本でも進むと思うので、アプリケーションとの連携が進むと、もっとFacebookが盛り上がりそうですね^^
何か、質問があったら私のFacebookアカウントまで、ご連絡いただけると嬉しいです。

参考ドキュメント

Twitterに投稿 Facebookでshare