先日の記事でLINE bot 作ってみたばかりですが、今度はFacebookからもbotのAPIが提供されました。
ワタクシの予測では追いつかないくらいのスピードで世の中はbot戦国時代に突入している様子。時代に遅れてなるものかということで早速Facebookのbotも検証してみます!
1.Facebook開発者登録
Facebookのアプリを作るためにはまず、開発者登録する必要があります。
とりあえずFacebook開発者ページから開発者登録を行いましょう。
2.Facebookページ、アプリの作成
Messanger botを利用するには実際に会話をするための顔となる『Facebookページ』、それから会話エンジンと通信する為の『Facebookアプリ』が必要になります。
なんだか面倒くさそうですが、正味10分もあれば終わるのでサクッといきましょう。
2-1.Facebookページの作成
Facebookページの作成はアカウントのメニューかサイドナビにも「Facebookページを作成する」リンクがあるのでそちから。
ジャンルを選んで必要事項を入力していきます。
メッセンジャーに名前として出てくるページ名と顔写真はしっかり入れておきましょう。
2-2.Facebookアプリの作成
Facebookアプリの作成は開発者ページから行っていきます。
上部のアカウントメニューに「新しいアプリを追加する」リンクがあるのでここをクリック ⇒ 最初にプラットフォームを選ぶ画面がありますがここは「basic setup」のリンクをクリックしてスキップしましょう。
アプリの名前や連絡先を入れてアプリを作成します。
2-3.Messengerの有効化とアクセストークンの取得
アプリの設定画面ではMessengerの項目を選んでMessengerプラットフォームを有効化します。
サイドメニューの下のほうにあるやつをクリック。
すると、以下のようなプラットフォーム作成ウィザードに入ります。
Messengerプラットフォームを有効化したら、トークン生成の箇所で紐づけるFacebookページを指定してページアクセストークンをメモしておきましょう。
3.適当なサーバーを用意する
さて、そして今回もおなじみ、無料でサッとサーバー環境を利用できる、我らがherokuを使わせていただきましょう。
フォームにしたがって必要情報を入力。アカウントを作成したらいよいよセットアップです。
4.サーバーアプリをセットアップする
今回は(LINEの時も利用させていただいたので今回“も”ですが)tmtyskさんが公開されているスターターキットを利用させてもらいます。
以下のリンクをクリックしページ中の「Deploy to Heroku」を押すとセットアップされます。
>>これからPHPでFacebook Messenger Botづくりを始める人向けの簡易スターターキット
セットアップ時に手順2-3でメモしたトークンを「FACEBOOK_PAGE_ACCESS_TOKEN」に入れます。
※「FACEBOOK_PAGE_VERIFY_TOKEN」は適当な文字列を入れてください。
また、herokuに登録した「App Name」「FACEBOOK_PAGE_VERIFY_TOKEN」をメモしておいてください。
5.Facebookアプリにサーバーの設定を入れる
FacebookアプリのMessengerページに戻り「Webhooks」の設定を入れます。
- コールバックURLに「https://[4でメモしたApp Name].herokuapp.com/callback」
- トークンを確認の箇所に「4でメモしたFACEBOOK_PAGE_VERIFY_TOKEN」を入れる。
- フォロー入力欄は「Messages」にチェックを入れる
6.FACEBOOK APIからアプリを登録にする
ターミナルからPOSTすることでアプリが登録されます。
curl -ik -X POST "https://graph.facebook.com/v2.6/me/subscribed_apps?access_token=[ページアクセストークン]"
Windowsはcurlが入っていませんのでダウンロードページからWindows版のcurlをダウンロードし、PowerShellなどから.exeをつけて実行しましょう。
curl.exe -ik -X POST "https://graph.facebook.com/v2.6/me/subscribed_apps?access_token=[ページアクセストークン]"
7.完成です
反映が完了したら実際にFacebookページのメッセージから話かけてみましょう。
入れた単語にたいして ~じゃないと返ってくれば成功です!
今回利用させてもらったサーバーアプリはソースコードが公開されていますので、時間があれば web/index.php を自分の好みの内容に修正してみましょう。
やってみたまとめ
今回もLINEのbotと同様にサクッと実装してみました。
手順自体に大差はないので、LINEでもFacebookでも実際に自サイトを利用しているユーザーを想像しながら最適なコミュニケーションを考えたいですね。