Facebookアプリを作ってみましたシリーズ1 (PHP編)
アプリはこちら、
ユーザーは何も入力する事なく自分が早生まれかどうかを知る事ができる新感覚アプリです。
http://kissrobber.com/hayaumare/
こまった事
Facebook側のバグでしょうか？
http://bugs.developers.facebook.net/show_bug.cgi?id=16866
なんかある程度以上のページサイズになるとURLリンターがOpeng Graphタグを認識してくれません。
その内修正されるとおもいますが、とりあえずは、User Agentを確認してFacebookからのクロールだった場合は本文を空っぽにしてページサイズを小さくする事で対応しました。
ソース
<?php echo "<?xml version=\"1.0\" encoding=\"UTF-8\"?>"; $is_facebook = false; $agent = $_SERVER['HTTP_USER_AGENT']; if(ereg("^facebookexternalhit", $agent)){ //なんかFacebookのバグっぽくてリンターが認識してくれないので一時的な対応として様子見。 $is_facebook = true; } else { require 'facebook.php'; // Create our Application instance (replace this with your appId and secret). $facebook = new Facebook(array( 'appId' => 'XXXXXXXXXXXXXXX', 'secret' => 'XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX', 'cookie' => true, )); $session = $facebook->getSession(); $me = null; // Session based API call. if ($session) { try { $uid = $facebook->getUser(); $me = $facebook->api('/me'); } catch (FacebookApiException $e) { error_log($e); } } // login or logout url will be needed depending on current user state. if ($me) { $logoutUrl = $facebook->getLogoutUrl(); $birthday = strptime($me['birthday'], '%m/%d/%Y'); $mon = $birthday['tm_mon'] + 1; $day = $birthday['tm_mday'] + 0; $is_early = ($mon == 1 || $mon == 2 || $mon == 3 || ($mon == 4 && $day == 1)); } else { $loginUrl = $facebook->getLoginUrl(array('req_perms' => 'user_birthday')); } } ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja" xmlns:og="http://ogp.me/ns#" xmlns:fb="http://www.facebook.com/2008/fbml"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>俺早生まれ？</title> <meta property="og:type" content="website" /> <meta property="og:title" content="俺早生まれ？" /> <meta property="og:url" content="http://kissrobber.com/hayaumare/" /> <meta property="og:image" content="http://kissrobber.com/hayaumare/logo.png" /> <meta property="fb:app_id" content="XXXXXXXXXXXXXXX" /> <meta property="og:description" content="俺早生まれ？" /> <meta name="author" content="http://iq148.com" /> <link rel="canonical" href="http://kissrobber.com/hayaumare/" /> <link rel="shortcut icon" href="http://kissrobber.com/hayaumare/favicon.ico" /> </head> <body> <?php if (!$is_facebook): ?> <?php if ($me): ?> 俺<?php if ($is_early){echo "遅";} else {echo "早";} ?>生まれ？<br/> <a href="javascript:void(0);" onclick="feed();"><img style="position:absolute;top:30px;left:15px;margin:0px;border-style:none;" src="<?php if ($is_early){echo "oso";} else {echo "haya";} ?>.png"/></a> <img style="position:absolute;top:30px;left:580px;margin:0px;" src="msg.png"/> <div style="position:absolute;top:30px;left:620px;margin:0px;padding:20px 10px;"> <div style="margin:0px;padding:5px 2px;"> <fb:like layout="button_count" href="http://kissrobber.com/hayaumare/"></fb:like> </div> <div style="margin:0px;padding:5px 2px;"> <a href="http://twitter.com/share" class="twitter-share-button" data-url="http://kissrobber.com/hayaumare/" data-text="俺<?php if ($is_early){echo "遅";} else {echo "早";} ?>生まれ？ → いいえ！" data-count="horizontal" data-via="kissrobber" data-lang="ja">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script> </div> <div style="margin:0px;padding:5px 2px;"> <a href="http://b.hatena.ne.jp/entry/http://kissrobber.com/hayaumare/" class="hatena-bookmark-button" data-hatena-bookmark-title="俺<?php if ($is_early){echo "遅";} else {echo "早";} ?>生まれ？" data-hatena-bookmark-layout="standard" title="このエントリーをはてなブックマークに追加"><img src="http://b.st-hatena.com/images/entry-button/button-only.gif" alt="このエントリーをはてなブックマークに追加" width="20" height="20" style="border: none;" /></a><script type="text/javascript" src="http://b.st-hatena.com/js/bookmark_button.js" charset="utf-8" async="async"></script> </div> </div> <!-- <?php echo $mon."-".$day ?> --> <?php else: ?> 俺早生まれ？<br/> <a href="<?php echo $loginUrl; ?>"> Facebookでログイン </a> <div> <fb:like layout="button_count" href="http://kissrobber.com/hayaumare/" show_faces="true"></fb:like> </div> <?php endif ?> <br/> <div id="fb-root"></div> <script src="http://connect.facebook.net/ja_JP/all.js"></script> <script> FB.init({ appId : 'XXXXXXXXXXXXXXX', status : true, cookie : true, xfbml : true }); <?php if ($me): ?> function feed(){ FB.ui( { method: 'feed', name: '俺<?php if ($is_early){echo "遅";} else {echo "早";} ?>生まれ？', link: 'http://kissrobber.com/hayaumare/', picture: 'http://kissrobber.com/hayaumare/logo.png', message: 'いいえ！', description: '<?php echo $me['name'] ?>さんは<?php if ($is_early){echo "遅";} else {echo "早";} ?>生まれ？', actions: {'name':'powered by iq148.com', 'link':'http://iq148.com'} }); } <?php endif ?> </script> <?php endif ?> </body> </html>
