第四回 Web API を使ってWeb アフリケーションを作る勉強会

〜 twitter , facebook の API を使って連携アフリを作り始めてみよう〜

前回のおさらい• ホットペッパーの API （リクルート Web

サービス）と twitter の API による投稿のみのフログラミング体験を 2 時間で行いました

• 2 つの API を無理矢理こじつけたマッシュアッフなどもやってみました・・・

twitter では• twitter アフリの登録• ライブラリの利用• ひな形を元にお知らせ bot を作成しました

<?phprequire_once("twitteroauth.php");

// OAuth アフリ登録で取得した Consumer key を設定$consumer_key=“xxxxxxxxxxxx";// OAuth アフリ登録で取得した Consumer secret を設定$consumer_secret=”xxxxxxxxxxxx";// https://dev.twitter.com/apps/ で取得した oauth_token を設定 (Access token)$oauth_token=”xxxxxxxxxx";// https://dev.twitter.com/apps/ で取得した oauth_token_secret を設定 (Access token secret)$oauth_token_secret=”xxxxxxxxxxxxxx";

// twitter アカウントに発言させる内容$message = " もしかして aaaa";

$status = $message;

// 発言を行うメソッドを指定$method = "statuses/update";

// パラメータを指定（ここでは発言内容を指定）$parameters = array("status" => $status);

// TwitterOAuth のインスタンスを生成$twitter = new TwitterOAuth( $consumer_key, $consumer_secret, $oauth_token, $oauth_token_secret);

// Twitter に発言を POST$response = $twitter->post($method, $parameters);$http_info = $twitter->http_info;$http_code = $http_info["http_code"];

// ツイートの成功可否を判別してその結果を画面表示（テキスト only ）if($http_code == "200" && !empty($response)) { print " ツイート成功 \n";} else { print " ツイート失敗 \n";}

?>

本日のテーマは認証• 自分が登録したアカウントで発言させる

のみでした（この勉強会では初の投稿系API ）

• 今日は第三者に自分が作ったサイトで認証してもらい、そこでその第三者のアカウントで発言してもらうことを目指します（この勉強会では初の認証系 API ）

• その第一歩として認証を行います

twitter & facebook

1時間目twitter で認証、タイムラインの取得、 friends タイムラインの取得

1 時間目の流れ1. 前回の bot の復習について2. ライブラリを使いましょう！3. 画面フローの確認（友達のツイートを見

るためのフロー）4. 作業ファイルのセットアッフ、準備5. 動作テスト6. friends_timeline にアクセス7. HTML に整形

twitter お知らせ bot の復習• oshirase.bot にアクセスす

るとすぐに発言される（そこに設定情報等すべて書かれている）

• Oauth.php とtwitteroauth.php というライブラリを利用している

• 登録したアフリケーション名が表示される（日本語文化圏でないクライアントでは全角文字は表示されない）

OAuth 認証• ライブラリを使いましょう！– twitteroauth at master from

abraham/twitteroauth – GitHubhttps://github.com/abraham/twitteroauth/tree/master/twitteroauth/

細かい認証の仕組みを気にせずに開発に集中出来る！

画面フローの確認

「 Signin ボタン」 友達のタイムライン表示

作業ファイルのセットアッフ• template フォルダから下記ファイルを work フォルダにコピーし

て作業を始めます– socialconfig.php

twitter のアクセストークンやコールバック関数を書き込んでください– apifunc.php– callback.php– clearsessions.php– connect.php– html.inc– images フォルダ（ボタンデザインが 2 種類入っている）– index.php– redirect.php– OAuth.php– twitteroauth.php

準備事項• callbackURL の設定

例： http://127.0.0.1/webapi4/sample/twitteroauth/callback.php

http://localhost/※ は受け付けられない※当然、サーバーにアッフした場合はサーバーの URL に書き換える必要がある

ファイルにアクセス• http://127.0.0.1/webapi4/work/index.php

※ はじめての時だけ

statuses/friends_timeline の取得• 自分の friends のツイートと自分のツイー

トで構成される（ home と異なりリツイートは含まれない）

• index.php 内の– $content =

$connection->get(‘account/verify_credentials’); を– $content =

$connection->get(‘statuses/friends_timeline’);と書き換えるだけ

HTML の形に整形するには？• 配列変数から一つずつの情報を取り出し

HTML テンフレートの中に埋め込んでいく

$content="";foreach ($contents as $hit) {$content .="<strong>".$hit->user->screen_name."</strong>\n";$content .=$hit->text."<hr>\n";}

twitter マッシュアッフのヒント

• タイムラインは人それぞれ、同じ物が存在しない。また、友達や気になる人が多い

• テキスト解析で感情をアイコン化したり、形態素解析もしくはキーフレーズ抽出でコンテンツマッチで商品紹介するなど※切り口＝検索、トレンド API の利用等

• twitter クライアントを作る。自分専用に使いやすくしたこだわりにクライアントを作る

• 掲示板投稿の認証に twitter を使い、掲示板投稿内容の頭 100 字ぐらいを本人とサイトアカウントの twitterタイムラインに流す

2時間目facebook API の概念、 PHP SDK の利用方法、アフリにする方法

2 時間目の流れ1. 開発者登録の確認2. facebook アフリ登録3. アフリを facebok に結合する4. 開発中は sandboxモードにする5. PHP SDKモードの利用方法6. フロフィール情報の表示解説7. friends リスト表示の解説

facebook の開発者登録• 事前に開発者登録のお願いをしております

（そこそこ時間と手間がかかります）• これからされる方はさっと済ませておいてく

ださい• 下記 URL が最新の開発者登録の方法を解説し

ているサイトです。無料の会員登録が必要ですが、有益な記事ですので、ご確認ください。

• http://itpro.nikkeibp.co.jp/article/COLUMN/20110929/369675/

facebook アフリ登録• https://developers.facebook.com/apps• 上記 URL から右上の「新しいアフリケー

ションを作成」ボタンを押して必要事項を記入します

アフリの名前を入れます半角英数字 7 文字以上で入力

アフリを Facebook に結合する

開発中は Sandboxモードにする• 開発中は他の人がアフリに触れないよう

にするため、 Sandboxモード（開発者のみ使える）にしておく

• 関係者を指定して使えるようにすることは出来る

PHP SDK の利用方法• https://github.com/facebook/php-sdk/• 上記 URL からダウンロードできる• しかし、最新版はすでに動かない・・・。

$session = $facebook->getSession();ここに問題があるらしい。下記の通り書き換えて、その後も準じて書き換えていきます。$uid = $facebook->getUser();※ 元となる参考ソースhttp://d.hatena.ne.jp/ramyana/20101012/1286897340

フロフィール情報• $me = $facebook->api('/me');• フロフィール情報の取り出しは

$me に配列の形で入っているので、 <?php echo $me[‘name’]; ?> といった PHP タグの形で記述できる。写真 URL はhttps://graph.facebook.com/ユーザー ID/pictureとなる

Friends リスト表示• $friends = $facebook->api('/me/friends'); • $friends に複数の友達情報が含まれていて、

$friends から $friend に一人ずつ情報を代入して foreach で回します。$friend[‘name’] でその人の名前を取り出すことが出来ます

facebook マッシュアッフヒント• 今回の事例は facebook アフリライク• 日常 facebook 使う人向けのコンテンツア

グリケーションサービス– Youtube 、ホットペッパー、地図等アフリとし

て登録しておくことでそのサイトに行かなくても便利なもの（付加価値がつくもの。例：居住地域や最寄り駅をベースにデフォルト検索されている等）

3時間目1 時間集中ワーク、マッシュアッフを目指す

舞台がどこになるかを決めよう

フラットフォームtwitter,facebook,mixi 等

アフリ

アフリ

レファレンス• ▽Documentation | Twitter Developers• https://dev.twitter.com/docs

• ▽Graph API - Facebook 開発者• https://developers.facebook.com/docs/reference/api/

• ▽Getting Started - Facebook 開発者• https://developers.facebook.com/docs/

参考書籍（ twitter ）• Twitter API フログラミング• Twitter API ポケットレファレンス

• 書籍ではないですが・・・Twitter API 仕様書http://watcher.moe-nifty.com/memo/docs/twitterAPI.txt

参考書籍（ facebook ）• スマートにフログラミング facebook アフリ開発• facebook アフリケーション開発ガイド（中級技術

者向け）• facebook デザインブックステッフアッフ活用編• 書籍ではないですが・・・

facebook アフリの作り方・ PHP 編（ 2010 年 10 月版） - 19790401173.4http://d.hatena.ne.jp/ramyana/20101012/1286897340

• 仕様変更が頻繁にあるためサンフルソースがそのまま使えないことに注意